我正在创建一个网页,其中我有一个输入文本字段,我想只允许数字字符,如(0,1,2,3,4,5…9)0-9。
我如何使用jQuery做到这一点?
我正在创建一个网页,其中我有一个输入文本字段,我想只允许数字字符,如(0,1,2,3,4,5…9)0-9。
我如何使用jQuery做到这一点?
当前回答
function validate_profile(frmid) {
var form = $('#' + frmid);
var error = $('.alert-danger', form);
var success = $('.alert-success', form);
form.validate({
errorElement: 'span', //default input error message container
errorClass: 'help-block', // default input error message class
focusInvalid: true, // do not focus the last invalid input
ignore: "",
rules: {
contact_no: {
required: true,
minlength: 10,
maxlength: 10,
number: true
}, email_id: {
required: true,
email: true
}
},
invalidHandler: function (event, validator) { //display error alert on form submit
success.hide();
error.show();
Metronic.scrollTo(error, -7000);
},
highlight: function (element) { // hightlight error inputs
$(element)
.closest('.form-group').addClass('has-error'); // un set error class to the control group
$(element)
.closest('.form-group').removeClass('has-success'); // set success class to the control group
},
unhighlight: function (element) { // revert the change done by hightlight
$(element)
.closest('.form-group').removeClass('has-error'); // un set error class to the control group
$(element)
.closest('.form-group').addClass('has-success'); // set success class to the control group
error.hide();
},
success: function (label) {
label.closest('.form-group').removeClass('has-error');
label.closest('.form-group').addClass('has-success');
},
submitHandler: function (form) {
success.show();
error.hide();
form.submit();
}
});
}
其他回答
你可以使用这个JavaScript函数:
function maskInput(e) {
//check if we have "e" or "window.event" and use them as "event"
//Firefox doesn't have window.event
var event = e || window.event
var key_code = event.keyCode;
var oElement = e ? e.target : window.event.srcElement;
if (!event.shiftKey && !event.ctrlKey && !event.altKey) {
if ((key_code > 47 && key_code < 58) ||
(key_code > 95 && key_code < 106)) {
if (key_code > 95)
key_code -= (95-47);
oElement.value = oElement.value;
} else if(key_code == 8) {
oElement.value = oElement.value;
} else if(key_code != 9) {
event.returnValue = false;
}
}
}
你可以像这样把它绑定到你的文本框:
$(document).ready(function() {
$('#myTextbox').keydown(maskInput);
});
我在生产中使用了上面的方法,它工作得很好,而且是跨浏览器的。此外,它不依赖于jQuery,所以你可以用内联JavaScript将它绑定到你的文本框:
<input type="text" name="aNumberField" onkeydown="javascript:maskInput()"/>
这似乎牢不可破。
// Prevent NULL input and replace text.
$(document).on('change', 'input[type="number"]', function (event) {
this.value = this.value.replace(/[^0-9\.]+/g, '');
if (this.value < 1) this.value = 0;
});
// Block non-numeric chars.
$(document).on('keypress', 'input[type="number"]', function (event) {
return (((event.which > 47) && (event.which < 58)) || (event.which == 13));
});
为了更详细地说明#3的答案,我将执行以下操作(注意:仍然不支持通过键盘或鼠标粘贴操作):
$('#txtNumeric').keypress(
function(event) {
//Allow only backspace and delete
if (event.keyCode != 46 && event.keyCode != 8) {
if (!parseInt(String.fromCharCode(event.which))) {
event.preventDefault();
}
}
}
);
function Numbers(e)
{
if($.browser.msie)
{
if(e.keyCode > 47 && e.keyCode < 58)
return true;
else
return false;
}
else
{
if((e.charCode > 47 && e.charCode < 58) || (e.charCode == 0))
return true;
else
return false;
}
}
我希望这在所有浏览器上都能工作。
这就是我最近写这篇文章的原因。我知道这个问题已经有人回答了,但我把它留到以后使用。
该方法只允许0-9键盘和numpad,退格,制表符,左右箭头(正常形式操作)
$(".numbersonly-format").keydown(function (event) {
// Prevent shift key since its not needed
if (event.shiftKey == true) {
event.preventDefault();
}
// Allow Only: keyboard 0-9, numpad 0-9, backspace, tab, left arrow, right arrow, delete
if ((event.keyCode >= 48 && event.keyCode <= 57) || (event.keyCode >= 96 && event.keyCode <= 105) || event.keyCode == 8 || event.keyCode == 9 || event.keyCode == 37 || event.keyCode == 39 || event.keyCode == 46) {
// Allow normal operation
} else {
// Prevent the rest
event.preventDefault();
}
});