मैं विशेष वर्णों को jquery के साथ इनपुट क्षेत्र में टाइप करने से कैसे रोक सकता हूं?
जवाबों:
नियमित अभिव्यक्ति का उपयोग करके एक सरल उदाहरण जिसे आप बदलने की अनुमति दे सकते हैं।
$('input').on('keypress', function (event) {
var regex = new RegExp("^[a-zA-Z0-9]+$");
var key = String.fromCharCode(!event.charCode ? event.which : event.charCode);
if (!regex.test(key)) {
event.preventDefault();
return false;
}
});मैं एक ऐसे उत्तर की तलाश में था जो केवल अल्फ़ान्यूमेरिक वर्णों तक इनपुट को प्रतिबंधित करता है, लेकिन फिर भी नियंत्रण वर्णों (जैसे, बैकस्पेस, डिलीट, टैब) और कॉपी + पेस्ट के उपयोग की अनुमति है। प्रदान किए गए उत्तरों में से कोई भी नहीं जो मैंने इन सभी आवश्यकताओं को पूरा करने की कोशिश की, इसलिए मैं इस inputघटना का उपयोग करके निम्नलिखित आया ।
$('input').on('input', function() {
$(this).val($(this).val().replace(/[^a-z0-9]/gi, ''));
});संपादित करें:
जैसा कि rinogo ने टिप्पणियों में बताया है, उपरोक्त कोड स्निपेट इनपुट टेक्स्ट के बीच में टाइप करते समय कर्सर को इनपुट के अंत में ले जाता है। मेरा मानना है कि नीचे कोड स्निपेट इस समस्या को हल करता है।
$('input').on('input', function() {
var c = this.selectionStart,
r = /[^a-z0-9]/gi,
v = $(this).val();
if(r.test(v)) {
$(this).val(v.replace(r, ''));
c--;
}
this.setSelectionRange(c, c);
});event.whichया event.keycode! काश मैं +10 कर पाता!
संक्षिप्त उत्तर: 'कीपर' ईवेंट को रोकें:
$("input").keypress(function(e){
var charCode = !e.charCode ? e.which : e.charCode;
if(/* Test for special character */ )
e.preventDefault();
})लंबे उत्तर: jquery.alphanum जैसे प्लगइन का उपयोग करें
समाधान चुनते समय कई बातों पर ध्यान देना चाहिए:
मुझे लगता है कि यह क्षेत्र तीसरे पक्ष के प्लगइन का उपयोग करके वारंट के लिए पर्याप्त जटिल है। मैंने कई उपलब्ध प्लगइन्स को आज़माया लेकिन उनमें से प्रत्येक के साथ कुछ समस्याएँ पाईं इसलिए मैंने आगे जाकर jquery.alphanum लिखा । कोड इस तरह दिखता है:
$("input").alphanum();या अधिक महीन दाने के नियंत्रण के लिए, कुछ सेटिंग्स जोड़ें:
$("#username").alphanum({
allow : "€$£",
disallow : "xyz",
allowUpper : false
});आशा करता हूँ की ये काम करेगा।
allowसेटिंग में डालते समय काम नहीं करता था । लेकिन यह jquery प्लगइन्स की सुंदरता है, तथ्य यह है कि आप उन्हें अपनी आवश्यकताओं के अनुरूप संशोधित कर सकते हैं। धन्यवाद!
allowविकल्प का उपयोग करके स्लैश को सक्षम करने का प्रयास किया और इस कोड का उपयोग करके मेरे लिए ठीक काम किया: $('#firstName').alphanum({allow: "/"});कोई भी मौका जो आप अधिक जानकारी प्रदान कर सकते हैं? यदि डॉक्स के साथ कोई बग या समस्या है, तो इसे ठीक करना अच्छा होगा। चीयर्स
allowOtherCharSets: falseऔर है allowCaseless: false। इनमें निर्धारित सेटिंग्स के साथ हस्तक्षेप किया गया allow। मेरे दृष्टिकोण से, मुझे लगता है कि allowविकल्प को अन्य सभी विकल्पों (जैसे allowOtherCharSetsया allowCaseless) को वीटो करना चाहिए । इसलिए यदि आप allowविकल्प में एक वर्ण निर्दिष्ट करते हैं , तो इसे कॉन्फ़िगरेशन ऑब्जेक्ट में सेट किए गए अन्य विकल्पों की परवाह किए बिना अनुमति दी जानी चाहिए। उसी के लिए जाता है disallow। लेकिन यह सिर्फ मेरी राय है। :) फिर से चीयर्स! :)
HTML5 के पैटर्न इनपुट विशेषता का उपयोग करें!
<input type="text" pattern="^[a-zA-Z0-9]+$" />आपका टेक्स्टबॉक्स:
<input type="text" id="name">आपकी जावास्क्रिप्ट:
$("#name").keypress(function(event) {
var character = String.fromCharCode(event.keyCode);
return isValid(character);
});
function isValid(str) {
return !/[~`!@#$%\^&*()+=\-\[\]\\';,/{}|\\":<>\?]/g.test(str);
}कुछ भी अनुमति / अस्वीकृति के लिए रेगेक्स का उपयोग करें। इसके अलावा, स्वीकृत उत्तर की तुलना में थोड़ा अधिक मजबूत संस्करण के लिए, उन पात्रों को अनुमति देने की अनुमति नहीं है जो उनके साथ जुड़े एक महत्वपूर्ण मूल्य (बैकस्पेस, टैब, तीर कुंजी, हटाएं, आदि) कीपर ईवेंट के माध्यम से पहले गुजरने से हो सकते हैं और मूल्य के बजाय कीकोड के आधार पर कुंजी की जाँच करें।
$('#input').bind('keydown', function (event) {
switch (event.keyCode) {
case 8: // Backspace
case 9: // Tab
case 13: // Enter
case 37: // Left
case 38: // Up
case 39: // Right
case 40: // Down
break;
default:
var regex = new RegExp("^[a-zA-Z0-9.,/ $@()]+$");
var key = event.key;
if (!regex.test(key)) {
event.preventDefault();
return false;
}
break;
}
});JQuery अल्फ़ान्यूमेरिक प्लगइन पर एक नज़र डालें। https://github.com/KevinSheedy/jquery.alphanum
//All of these are from their demo page
//only numbers and alpha characters
$('.sample1').alphanumeric();
//only numeric
$('.sample4').numeric();
//only numeric and the .
$('.sample5').numeric({allow:"."});
//all alphanumeric except the . 1 and a
$('.sample6').alphanumeric({ichars:'.1a'});टेक्स्टबॉक्स के onkeypress घटना पर कुछ जावास्क्रिप्ट कोड लिखें। आवश्यकता के अनुसार अपने टेक्स्टबॉक्स में चरित्र को अनुमति दें और प्रतिबंधित करें
function isNumberKeyWithStar(evt) {
var charCode = (evt.which) ? evt.which : event.keyCode
if (charCode > 31 && (charCode < 48 || charCode > 57) && charCode != 42)
return false;
return true;
}
function isNumberKey(evt) {
var charCode = (evt.which) ? evt.which : event.keyCode
if (charCode > 31 && (charCode < 48 || charCode > 57))
return false;
return true;
}
function isNumberKeyForAmount(evt) {
var charCode = (evt.which) ? evt.which : event.keyCode
if (charCode > 31 && (charCode < 48 || charCode > 57) && charCode != 46)
return false;
return true;
}मैं इस कोड को दूसरों को संशोधित करने के लिए उपयोग करता हूं जो मैंने देखा था। उपयोगकर्ता के लिए केवल भव्य लिखना अगर कुंजी दबाया या चिपकाए गए पाठ पैटर्न टेस्ट (मैच) पास करें (यह उदाहरण एक पाठ इनपुट है जो केवल 8 अंकों की अनुमति देता है)
$("input").on("keypress paste", function(e){
var c = this.selectionStart, v = $(this).val();
if (e.type == "keypress")
var key = String.fromCharCode(!e.charCode ? e.which : e.charCode)
else
var key = e.originalEvent.clipboardData.getData('Text')
var val = v.substr(0, c) + key + v.substr(c, v.length)
if (!val.match(/\d{0,8}/) || val.match(/\d{0,8}/).toString() != val) {
e.preventDefault()
return false
}
})!e.charCode ? e.which : e.charCodeबस और क्यों नहीं e.charCode ? e.charCode : e.which?
यह एक उदाहरण है जो उपयोगकर्ता को "a" टाइप करने से रोकता है
$(function() {
$('input:text').keydown(function(e) {
if(e.keyCode==65)
return false;
});
});कुंजी कोड यहाँ refrence:
http://www.expandinghead.net/keycode.html
$(function(){
$('input').keyup(function(){
var input_val = $(this).val();
var inputRGEX = /^[a-zA-Z0-9]*$/;
var inputResult = inputRGEX.test(input_val);
if(!(inputResult))
{
this.value = this.value.replace(/[^a-z0-9\s]/gi, '');
}
});
});हाँ आप jQuery का उपयोग करके कर सकते हैं:
<script>
$(document).ready(function()
{
$("#username").blur(function()
{
//remove all the class add the messagebox classes and start fading
$("#msgbox").removeClass().addClass('messagebox').text('Checking...').fadeIn("slow");
//check the username exists or not from ajax
$.post("user_availability.php",{ user_name:$(this).val() } ,function(data)
{
if(data=='empty') // if username is empty
{
$("#msgbox").fadeTo(200,0.1,function() //start fading the messagebox
{
//add message and change the class of the box and start fading
$(this).html('Empty user id is not allowed').addClass('messageboxerror').fadeTo(900,1);
});
}
else if(data=='invalid') // if special characters used in username
{
$("#msgbox").fadeTo(200,0.1,function() //start fading the messagebox
{
//add message and change the class of the box and start fading
$(this).html('Sorry, only letters (a-z), numbers (0-9), and periods (.) are allowed.').addClass('messageboxerror').fadeTo(900,1);
});
}
else if(data=='no') // if username not avaiable
{
$("#msgbox").fadeTo(200,0.1,function() //start fading the messagebox
{
//add message and change the class of the box and start fading
$(this).html('User id already exists').addClass('messageboxerror').fadeTo(900,1);
});
}
else
{
$("#msgbox").fadeTo(200,0.1,function() //start fading the messagebox
{
//add message and change the class of the box and start fading
$(this).html('User id available to register').addClass('messageboxok').fadeTo(900,1);
});
}
});
});
});
</script>
<input type="text" id="username" name="username"/><span id="msgbox" style="display:none"></span>और आपके user_avucation.php के लिए स्क्रिप्ट होगी:
<?php
include'includes/config.php';
//value got from the get method
$user_name = trim($_POST['user_name']);
if($user_name == ''){
echo "empty";
}elseif(preg_match('/[\'^£$%&*()}{@#~?><>,|=_+¬-]/', $user_name)){
echo "invalid";
}else{
$select = mysql_query("SELECT user_id FROM staff");
$i=0;
//this varible contains the array of existing users
while($fetch = mysql_fetch_array($select)){
$existing_users[$i] = $fetch['user_id'];
$i++;
}
//checking weather user exists or not in $existing_users array
if (in_array($user_name, $existing_users))
{
//user name is not availble
echo "no";
}
else
{
//user name is available
echo "yes";
}
}
?>मैं के लिए जोड़ने की कोशिश की / और \ नहीं बल्कि सफल रहा।
आप इसे जावास्क्रिप्ट का उपयोग करके भी कर सकते हैं और कोड होगा:
<!-- Check special characters in username start -->
<script language="javascript" type="text/javascript">
function check(e) {
var keynum
var keychar
var numcheck
// For Internet Explorer
if (window.event) {
keynum = e.keyCode;
}
// For Netscape/Firefox/Opera
else if (e.which) {
keynum = e.which;
}
keychar = String.fromCharCode(keynum);
//List of special characters you want to restrict
if (keychar == "'" || keychar == "`" || keychar =="!" || keychar =="@" || keychar =="#" || keychar =="$" || keychar =="%" || keychar =="^" || keychar =="&" || keychar =="*" || keychar =="(" || keychar ==")" || keychar =="-" || keychar =="_" || keychar =="+" || keychar =="=" || keychar =="/" || keychar =="~" || keychar =="<" || keychar ==">" || keychar =="," || keychar ==";" || keychar ==":" || keychar =="|" || keychar =="?" || keychar =="{" || keychar =="}" || keychar =="[" || keychar =="]" || keychar =="¬" || keychar =="£" || keychar =='"' || keychar =="\\") {
return false;
} else {
return true;
}
}
</script>
<!-- Check special characters in username end -->
<!-- in your form -->
User id : <input type="text" id="txtname" name="txtname" onkeypress="return check(event)"/>बस संख्या:
$ ('input.time')। कीडडाउन (फंक्शन (e) {if (e.keyCode> = 48 && e.keyCode <= 57) {return true;} अौर {return false;}}}।
या ":" सहित समय के लिए
$ ('input.time')। कीडाउन (फ़ंक्शन (e) {if (e.keyCode> = 48 && e.keyCode <= 58) {वापसी सच;} और {{झूठा वापस;}}};
हटाएं और बैकस्पेस भी शामिल करें:
INR असत्य; } });
दुर्भाग्य से यह एक iMAC पर काम करने के लिए नहीं मिल रहा है
डेल के जवाब के लिए एलेक्स की टिप्पणी पर टिप्पणी करना चाहता था। संभव नहीं है (पहले "कितना" रेप की जरूरत है? यह बहुत जल्द नहीं होगा .. अजीब प्रणाली।) तो एक जवाब के रूप में:
बैकस्पेस को रेगेक्स परिभाषा में इस तरह से \ b जोड़कर जोड़ा जा सकता है: [a-zA-Z0-9 \ b]। या आप बस पूरी लैटिन रेंज को अनुमति देते हैं, जिसमें कम या ज्यादा "नॉन एग्जॉटिक" अक्षर भी शामिल हैं (बैकस्पेस जैसे चार्ट को भी नियंत्रित करते हैं): ^ [\ u0000- \ u024F \ u20AC] + $
केवल असली यूनिकोड चार लेट के बाहर यूरो का चिह्न (20ac) है, जो भी आपको आवश्यकता हो उसे जोड़ सकते हैं।
कॉपी और पेस्ट के माध्यम से दर्ज किए गए इनपुट को संभालने के लिए, बस "परिवर्तन" घटना के लिए भी बाध्य करें और इनपुट की भी जांच करें - इसे हटा देना या इसे स्ट्रिप करना / "समर्थित वर्ण नहीं" जैसे त्रुटि संदेश देना ..
if (!regex.test($j(this).val())) {
alert('your input contained not supported characters');
$j(this).val('');
return false;
}कीपर पर विशेष वर्णों को प्रतिबंधित करें। यहां कुंजी कोड के लिए एक परीक्षण पृष्ठ है: http://www.asquare.net/javascript/tests/KeyCode.html
var specialChars = [62,33,36,64,35,37,94,38,42,40,41];
some_element.bind("keypress", function(event) {
// prevent if in array
if($.inArray(event.which,specialChars) != -1) {
event.preventDefault();
}
});कोणीय में, मुझे अपने टेक्स्टफील्ड में एक उचित मुद्रा प्रारूप की आवश्यकता थी। मेरा समाधान:
var angularApp = angular.module('Application', []);
...
// new angular directive
angularApp.directive('onlyNum', function() {
return function( scope, element, attrs) {
var specialChars = [62,33,36,64,35,37,94,38,42,40,41];
// prevent these special characters
element.bind("keypress", function(event) {
if($.inArray(event.which,specialChars) != -1) {
prevent( scope, event, attrs)
}
});
var allowableKeys = [8,9,37,39,46,48,49,50,51,52,53,54,55,56
,57,96,97,98,99,100,101,102,103,104,105,110,190];
element.bind("keydown", function(event) {
if($.inArray(event.which,allowableKeys) == -1) {
prevent( scope, event, attrs)
}
});
};
})
// scope.$apply makes angular aware of your changes
function prevent( scope, event, attrs) {
scope.$apply(function(){
scope.$eval(attrs.onlyNum);
event.preventDefault();
});
event.preventDefault();
}Html में निर्देश जोड़ें
<input only-num type="text" maxlength="10" id="amount" placeholder="$XXXX.XX"
autocomplete="off" ng-model="vm.amount" ng-change="vm.updateRequest()">और इसी कोणीय नियंत्रक में मैं केवल केवल 1 अवधि होने की अनुमति देता हूं, पाठ को संख्या में परिवर्तित करता हूं और 'ब्लर' पर नंबर राउंडिंग जोड़ता हूं
...
this.updateRequest = function() {
amount = $scope.amount;
if (amount != undefined) {
document.getElementById('spcf').onkeypress = function (e) {
// only allow one period in currency
if (e.keyCode === 46 && this.value.split('.').length === 2) {
return false;
}
}
// Remove "." When Last Character and round the number on blur
$("#amount").on("blur", function() {
if (this.value.charAt(this.value.length-1) == ".") {
this.value.replace(".","");
$("#amount").val(this.value);
}
var num = parseFloat(this.value);
// check for 'NaN' if its safe continue
if (!isNaN(num)) {
var num = (Math.round(parseFloat(this.value) * 100) / 100).toFixed(2);
$("#amount").val(num);
}
});
this.data.amountRequested = Math.round(parseFloat(amount) * 100) / 100;
}
...विशेष पात्रों को बदलने के लिए, स्थान और निचले मामले में परिवर्तित करें
$(document).ready(function (){
$(document).on("keyup", "#Id", function () {
$("#Id").val($("#Id").val().replace(/[^a-z0-9\s]/gi, '').replace(/[_\s]/g, '').toLowerCase());
});
});[User below code to restrict special character also
$(h.txtAmount).keydown(function (event) {
if (event.shiftKey) {
event.preventDefault();
}
if (event.keyCode == 46 || event.keyCode == 8) {
}
else {
if (event.keyCode < 95) {
if (event.keyCode < 48 || event.keyCode > 57) {
event.preventDefault();
}
}
else {
if (event.keyCode < 96 || event.keyCode > 105) {
event.preventDefault();
}
}
}
});]केवल पाठ बॉक्स में नंबर की अनुमति दें (अक्षर और विशेष वर्ण प्रतिबंधित करें)
/*code: 48-57 Numbers
8 - Backspace,
35 - home key, 36 - End key
37-40: Arrow keys, 46 - Delete key*/
function restrictAlphabets(e){
var x=e.which||e.keycode;
if((x>=48 && x<=57) || x==8 ||
(x>=35 && x<=40)|| x==46)
return true;
else
return false;
}/**
* Forbids special characters and decimals
* Allows numbers only
* */
const numbersOnly = (evt) => {
let charCode = (evt.which) ? evt.which : evt.keyCode;
if (charCode === 46 && charCode > 31 && (charCode < 48 || charCode > 57)) {
return false;
}
let inputResult = /^[0-9]*$/.test(evt.target.value);
if (!inputResult) {
evt.target.value = evt.target.value.replace(/[^a-z0-9\s]/gi, '');
}
return true;
}