Kuinka poistaa tietyt merkit syötteestä?

Alla olevan skriptin avulla voit tarkistaa, että kenttä on syötetty oikein. Tämä rajoittaa tiettyjen merkkien syöttämistä tekstinsyöttökenttään.

Merkkien tarkistus tekstinsyöttökentässä voidaan tehdä sekä itse syötteen että tietyn tapahtuman aikana. Skriptiä voidaan käyttää rekisteröintikentissä, kirjautumislomakkeissa jne. Voit kieltää tietyt merkit tai merkkiryhmän. Voit esimerkiksi kieltää kokonaan numeroiden syöttämisen, kieltää välilyönnit, sarkaimet ja kyrilliset tai latinalaiset aakkoset.

200?"200px":""+(this.scrollHeight+5)+"px");">

["0-9",":"] - merkit, joiden syöttäminen tähän kenttään on kielletty. Lisätty lainausmerkeissä pilkuilla erotettuna.

Hahmoryhmät

"0-9" tai "\d" - numeeriset arvot
"a-ya" - kyrillisten aakkosten pienet kirjaimet
"A-Z" - kyrillisten aakkosten isot kirjaimet
"A-ya" - kaikki kyrillisten aakkosten kirjaimet
"a-z" - pienet latinalaiset kirjaimet (latinan ensimmäinen kirjain)
"A-Z" - latinalaisten aakkosten isot kirjaimet (latinan ensimmäinen kirjain)
"A-z" - kaikki latinalaiset kirjaimet (ensimmäinen kirjain on latinalainen)
"A-ya" - kaikki kirjaimet (Ensimmäinen kirjain on latinalainen)
"\w" - kaikki kirjaimet, numerot ja symboli "_"
"\s" - välilyönti-, sarkain- ja kappalemerkit

Huomio! Tämän materiaalin kopioiminen ilman linkkiä verkkosivustolle on kielletty

Lähde / Borat

Yksi yleisimmistä tehtävistä. Haluat joko suojata lomakkeen lainausmerkkien ja vinoviivojen kirjoittamiselta tai haluat välittömän translitteroinnin. Miten muuten voit laittaa lomakkeen sisällön haluttuun järjestykseen asiakaspuolella?

Kuinka estää tiettyjen merkkien syöttäminen tai korvata ne kentässä tai tekstialueella JS? Logiikka on yksinkertainen - luomme ensimmäisen taulukon merkillä, jotka haluamme korvata, ja sitten toisen - niillä, jotka lisäämme ensimmäisten sijasta. Yhteensä: kaksi taulukkoa, joissa on sama(!) määrä elementtejä.

var transChars = new Array(""",""");

{

var from = nameForm;

Muutt = "";
var len = from.length;
var merkki, isRus;
for (var i = 0; i< len; i++)
{

isRus = false;
for (var j = 0; j< rusChars.length; j++)
{

{
isRus = tosi;
tauko;
}
}

}

}
Voit täyttää taulukot omilla korvaussymboleillasi. Kaikki mitä tarvitset! Alla on esimerkkejä.

Jos haluamme korvata esimerkiksi kyrilliset aakkoset latinalaisilla kirjaimilla tai yksinkertaisemmin sanottuna suorittaa välittömän translitteroinnin) Katso alla:

Var rusChars = new Array("A","a","B","b","C","c","D","g","D","d","E", "e", "Ё", "e", "Zh", "zh", "Z", "z",


"Sh", "sh", "Shch", "shch", "E", "e", "Yu", "yu", "Ya", "ya", "Y", "y", "b" " ","b");



"sh","sh","csh","csh","e","e","u","u","ya","ya","i","i","" ,"");
Jos haluamme korvata tietyt merkit kentässä - kerta- ja kaksoislainausmerkit heittomerkillä, joka tietokantaan tallennettuna ei salli virheellisten tietojen vastaanottamista).

Var rusChars = new Array(""","\"");
var transChars = new Array(""",""");

Kuinka kutsua funktio kentän merkkien korvaamiseksi? Lisää seuraavat syöttö- tai tekstialueen loppuun. Ensimmäinen arvo on lomakkeen tunniste, toinen on kenttä, jossa on syötetyt merkit, kolmas - jos haluamme näyttää merkkejä toisessa kentässä, ilmoitamme toisen kentän tunnisteen. Voit jättää tunnuksen ennalleen)

Onblur="convert("lomakkeen nimi", "mihin se vaihdetaan", "minne lisäämme korvatun");"
No, alla on esimerkki tiedostojen käsittelystä ja esittelyjen katselusta!

Useita esimerkkejä merkkien korvaamisesta syöttökentissä

Korvaa tietyt merkit syöttökentässä JS:llä

var rusChars = new Array("A","a","B","b","C","c","D","g","D","d","E", "e", "Ё", "e", "Zh", "zh", "Z", "z",
"I", "i", "Y", "y", "K", "k", "L", "l", "M", "m", "N", "n", "O" " ","o", "P", "p",
"R", "r", "S", "s", "T", "t", "U", "u", "F", "f", "X", "x", "H" " ","ch", "Ts", "ts",
"Sh", "sh", "Shch", "sch", "E", "e", "Yu", "yu", "Ya", "ya", "Y", "y", "b" " ""b",""","\"");
var transChars = new Array("a","a","b","b","v","v","g","g","d","d","e", "e", "jo", "jo", "zh", "zh", "z", "z",
"i","i","y","y","k","k","l","l","m","m","n","n","o" ","o","p","p",
"r", "r", "s", "s", "t", "t", "u", "u", "f", "f", "h", "h", "ch" ","ch","ts","ts",
"sh","sh","csh","csh","e","e","u","u","ya","ya","i","i","" "",","","");

Funktio convert(the_form, conv_froms, conv_to)
{
var nameForm = document.forms.value;
var from = nameForm;

Muutt = "";
var len = from.length;
var merkki, isRus;
for (var i = 0; i< len; i++)
{
merkki = from.substr(i,1);
isRus = false;
for (var j = 0; j< rusChars.length; j++)
{
if (merkki == rusChars[j])
{
isRus = tosi;
tauko;
}
}
+= (isRus) ? transChars[j] : merkki;
}
document.forms.value = to;
}

Heti yhdellä alalla

Yhdeltä toiselle

Käsikirjoitusten ydin, jota tarkastelemme edelleen, on saada kiinni vierailijan toiminnasta lennossa ja estää häntä syöttämästä mitään tiettyyn kenttään paitsi numeroita. Eli kun kohdistin on kohdistettu kenttään, kun yrität painaa näppäimistön kirjaimia, kentällä ei tapahdu mitään, samalla voit syöttää numeroita ja joitain symboleja, kuten + - () ja niin edelleen , jota voidaan tarvita kenttiin puhelinnumero tai muu digitaalinen numero.

Jotta tämä komentosarja toimisi, tarvitset ensin kentän numeron syöttämistä varten. Esimerkiksi lomakkeen sisällä on kenttä, joka näyttää tältä:

Ensimmäinen komentosarja käyttää jQuerya, joten sinun on lisättävä yhteys jQuery-kirjastoon sivustosi ylätunnisteeseen ennen sulkevaa otsikkoa tai alatunnisteeseen ennen sulkevaa runkoosaa. Jos teit tämän tai sisällönhallintajärjestelmä (sivustomoottori) tekee sen, sinun ei tarvitse tehdä tätä. Voit katsoa sivuston lähdekoodia ja jos jossain on samanlainen rivi, tämä vaihe on ohitettava. Jos yhteyttä ei ole, sinun on lisättävä seuraava rivi:

Nyt on itse käsikirjoituksen vuoro. Lisäämme sen erilliseen tiedostoon ja sisällytämme sen kirjaston jälkeen tai liitämme sen tunnisteisiin:

/// KOODI TÄSTÄ...

No, itse koodi:

JQuery(document).ready(function($)( $.fn.forceNumbericOnly = function() ( return this.each(function() ( $(this).keydown(function(e)) ( var key = e.charCode | ||

Henkilökohtaisesti käytän ensimmäistä koodia, se on minulle kätevämpi. Kumman valitset, on myös sinun päätettävissäsi.

Siinä kaikki, kiitos huomiosta. 🙂

Taulukko javascriptin virtuaalisista avainkoodeista, kuten yllä luvattiin.

Avain	10. koodi	Avain	10. koodi
Askelpalautin	8
Tab	9	Enter	13
Siirtää	16	Ctrl	17
Alt	18	Tauko	19
CapsLock	20	Esc	27
tilaa	32	Sivu ylös	33
PageDown	34	Loppu	35
Kotiin	36	vasen nuoli	37
nuoli ylös	38	oikea nuoli	39
alanuoli	40	Lisää	45
Poistaa	46	0	48
1	49	2	50
3	51	4	52
5	53	6	54
7	55	8	56
9	57	A	65
B	66	C	67
	68	E	69
F	70	G	71
H	72	minä	73
J	74	K	75
L	76	M	77
N	78	O	79
P	80	K	81
R	82	S	83
T	84	U	85
V	86	W	87
X	88	Y	89
Z	90	vasen Windows-näppäin	91
oikea Windows-näppäin	92	Sovellusavain	93
Numeronäppäimistö 0	96	Numeronäppäimistö 1	97
Numeronäppäimistö 2	98	Numeronäppäimistö 3	99
Numeronäppäimistö 4	100	Numeronäppäimistö 5	101
Numeronäppäimistö 6	102	Numeronäppäimistö 7	103
Numeronäppäimistö 8	104	Numeronäppäimistö 9	105
NumPad*	106	Numeronäppäimistö +	107
NumPad -	109	NumPad.	110
NumPad /	111	F1	112
F2	113	F3	114
F4	115	F5	116
F6	117	F7	118
F8	119	F9	120
F10	121	F11	122
F12	123	NumLock	144
ScrollLock	145	PrintScreen	154
Meta	157	;	186
=	187	,	188
-	189	.	190
/	191	~	192
[	219	\	220
]	221	"	222

Sain melko normaalin tehtävän: suodattaa käyttäjän syötteeseen syöttämät merkit, eli käyttäjä voi syöttää riville joukon numeroita ja kirjaimia, esim. "5s68d.4r55e.6t5" ja palvelimelle I on lähetettävä oikea summa ruplissa säästämistä varten - "568.455" (ruplaa).

Suoritin tehtävän melko nopeasti liittämällä syötteeseen fokusointitapahtuman, mutta ratkaisussani oli useita tärkeitä puutteita: mihin tässä esimerkissä päättyy ruplamääräinen ja alkaa kopikat? Jos käyttäjä syöttää useita miinuksia (negatiiviset arvot ovat myös tässä tapauksessa oikein), mitä miinuksista tulisi pitää rivin alussa? Ja niin edelleen.

Siksi skriptistä ilmestyi toinen versio säännöllisillä lausekkeilla avaintapahtumalle:

$(e.currentTarget).val(($(e.currentTarget).val()).replace(/[^0123456789.-]/, ""))
Mutta kuten kävi ilmi, tällä menetelmällä oli huomattava haittapuoli (en tarkoita, että käyttäjä näkee kirjoittamansa merkin ja sitten tämä merkki katoaa), nimittäin jos asetat kohdistimen esimerkiksi keskelle syöttämäsi numero, syötä kirjain, niin skripti leikkaa kirjaimen pois, mutta siirtää radat rivin loppuun.

Tästä syystä vanhempi ystäväni käski minua kirjoittamaan funktion näppäinpainallustapahtumaa varten. 30 minuutin kuluttua toiminnon kolmas versio oli valmis ja se näytti suunnilleen tältä:

Function() ( return this.each(function() ( $(this).keydown(function(e) ( var key = e.charCode || e.keyCode || 0; // salli askelpalautin, sarkain, poista, enter , VAIN nuolet, numerot ja näppäimistön numerot // koti-, loppu-, piste- ja numeronäppäimistön desimaalipalautus (näppäin == 8 || näppäin == 9 || näppäin == 13 || näppäin == 46 || näppäin == 110 | |. näppäin == 190 || (näppäin >= 35 &&-näppäin = 48 &&-näppäin = 96 &&-näppäin