jquery输入框只能输入数字 - 果核剥壳

1. 使用jQuery的keypress事件

jQuery的keypress事件可以监听用户的键盘输入，我们可以在这个事件的回调函数中检查用户输入的字符是否为数字或小数点，如果是，则允许输入；否则，阻止输入。

以下是一个简单的示例：

JavaScript
$("input").on("keypress", function(e) {
var key = e.which;
if ((key >= 48 && key <= 57) || key == 46) {
return true;
} else {
return false;
}
});
在这个示例中，我们第一为id为input的元素绑定了一个keypress事件，在事件的回调函数中，我们获取了用户输入的字符的ASCII码（通过e.which），如果ASCII码在48到57之间（这是数字0到9的ASCII码），或者ASCII码等于46（这是小数点的ASCII码），那么我们返回true，表示允许输入；否则，我们返回false，表示阻止输入。

2. 使用jQuery的input事件

除了keypress事件，我们还可以使用jQuery的input事件来监听用户的输入，这个事件会在用户修改元素的内容时触发，我们可以在这个事件的回调函数中检查用户输入的内容是否为数字或小数点，如果是，则允许输入；否则，阻止输入。

以下是一个简单的示例：

JavaScript
$("input").on("input", function() {
var value = $(this).val();
if (/^\d+(\.\d+)?$/.test(value)) {
return true;
} else {
$(this).val(value.substring(0, value.length 1));
return false;
}
});
在这个示例中，我们第一为id为input的元素绑定了一个input事件，在事件的回调函数中，我们获取了用户输入的内容（通过$(this).val()），接着，我们使用正则表达式/^\d+(\.\d+)?$/来检查内容是否为数字或小数点，如果是，则返回true，表示允许输入；否则，我们将内容的最后一个字符删除（通过value.substring(0, value.length 1)），并返回false，表示阻止输入。

3. 使用jQuery的paste事件

用户可能会通过粘贴的方式来输入内容，为了确保用户只能粘贴数字和小数点，我们可以使用jQuery的paste事件来监听粘贴操作，我们可以在这个事件的回调函数中检查粘贴的内容是否为数字或小数点，如果是，则允许粘贴；否则，阻止粘贴。

以下是一个简单的示例：

JavaScript
$("input").on("paste", function(e) {
e.preventDefault();
var clipboardData = e.originalEvent.clipboardData.getData('text/plain');
if (/^\d+(\.\d+)?$/.test(clipboardData)) {
this.value = clipboardData;
} else {
this.value = this.value.substring(0, this.value.length 1);
}
});
在这个示例中，我们第一为id为input的元素绑定了一个paste事件，在事件的回调函数中，我们第一调用e.preventDefault()来阻止默认的粘贴操作，接着，我们获取了粘贴板的内容（通过e.originalEvent.clipboardData.getData('text/plain')），我们使用正则表达式/^\d+(.\d+)?$/来检查内容是否为数字或小数点，如果是，则将内容设置为元素的值；否则，将元素的值设置为去掉最后一个字符的值。