当我提供输入类型编号时，字母 e 和特殊字符也会显示在输入字段中。我只想显示数字。怎么屏蔽？
<input type="number">【问题讨论】：
1e1 是一个有效数字，即exponential notation。
标签： javascript html angularjs
你可以使用 jQuery 轻松做到这一点
试试这个代码
$(function() {
$("#input").keypress(function(event) {
if (event.which != 8 && event.which != 0 && (event.which < 48 || event.which > 57)) {
$(".alert").html("Enter only digits!").show().fadeOut(2000);
return false;
}
});
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="number" id="input" />
<div class="alert"></div>【讨论】：
如果您不喜欢传入的键值，请尝试阻止默认行为：
document.querySelector(".your_class").addEventListener("keypress", function (evt) {
if (evt.which != 8 && evt.which != 0 && evt.which < 48 || evt.which > 57)
{
evt.preventDefault();
}
});
// 0 for null values
// 8 for backspace
// 48-57 for 0-9 numbers<input type="number" class="your_class">【讨论】：
您可以尝试替换非数字值，而不是尝试阻止值。
如果您选择处理键码，则必须处理 numKeys、numPad、shift +、crtl + 等，并且在焦点位于文本框内时尝试刷新也会失败。防止默认值会比不正确的值停止更多。
$("#input").on("input", function() {
var nonNumReg = /[^0-9]/g
$(this).val($(this).val().replace(nonNumReg, ''));
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="tel" id="input" />
<div class="alert"></div>【讨论】：
您可以使用keydown 事件阻止输入这些字符
var inputBox = document.getElementById("inputBox");
var invalidChars = [
"-",
"+",
"e",
];
inputBox.addEventListener("keydown", function(e) {
if (invalidChars.includes(e.key)) {
e.preventDefault();
}
});<input type="number" id="inputBox" />但如果他/她进行复制/粘贴（或通过控制台），用户仍然可以输入它们。为了防止复制/粘贴，您可以对输入的值 [*] 进行替换。
var inputBox = document.getElementById("inputBox");
var invalidChars = [
"-",
"+",
"e",
];
inputBox.addEventListener("input", function() {
this.value = this.value.replace(/[e\+\-]/gi, "");
});
inputBox.addEventListener("keydown", function(e) {
if (invalidChars.includes(e.key)) {
e.preventDefault();
}
});<input type="number" id="inputBox" />* 在类型设置为数字的输入字段中，您无法真正获取输入的值。只要是数字就可以获取输入的值，即该值通过内部数字校验。如果用户复制/粘贴1e，建议的解决方案将失败。
当您输入 1e 时会发生什么情况，输入字段会检查它是否是数字，如果不是（1e 不是）它会引发警告：
指定的值“1e”不是有效数字。该值必须与以下正则表达式匹配：-?(\d+|\d+.\d+|.\d+)([eE][-+]?\d+)?
并且value 属性设置为""。
如果您检查该字段的属性，您会发现valueAsNumber 属性。如果输入的值是数字，输入字段会解析该值并将其存储在valueAsNumber 中。由于1e 不是数字，它的计算结果为NaN，NaN 被分配给valueAsNumber，value 被设置为""。尽管您仍然在输入字段中看到1e。
我已经问过一个与此问题相关的问题，但还没有解决方案。
【讨论】：
由于 OP 的问题被标记为“angularjs”，最简洁的解决方案可能是使用指令。之前已在此处解释了此方法的几种解决方案：
【讨论】：
如果您想 + 登录您的电话号码字段，则可以使用此代码。
var inputBox = document.getElementById("inputBox");
var invalidChars = [
"-",
"e",
];
inputBox.addEventListener("keydown", function(e) {
if (invalidChars.includes(e.key)) {
e.preventDefault();
}
});<input type="number" id="inputBox" />【讨论】：
$("#input").on("input", function() {
var nonNumReg = /[^0-9]/g
$(this).val($(this).val().replace(nonNumReg, ''));
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="tel" id="input" />
<div class="alert"></div>
【讨论】：
按照上述答案的形式，上面的大多数示例都涵盖了它，我只是注意到在输入“E”时这仍然是允许的，所以我认为最好将它添加到数组中。我在这个例子中使用 Jquery 3.3.1。
这样，无论您输入到数组中的任何内容都将被阻止输入到输入框中
注意 - 将 'elementid' 作为你想要应用的元素的 id 同样，如果您想将此应用于 JQuery 中类型为数字的所有输入 --> $("input[type='number']")
var invalidChars = ["-", "e", "+", "E"];
$("input[type='number']").on("keydown", function(e){
if(invalidChars.includes(e.key)){
e.preventDefault();
}
}):
上面的这个示例应该适用于所有类型为数字的输入，并防止字符“-”、“e”、“+”和“E”被键入输入。
更新
还注意到您可以输入“。”因为它们代表对数字有效的小数点。我正在使用此验证电话号码，显然（对于英国）没有“。”所以这也可能是要添加到您的数组中的另一个字符。
【讨论】：
你可以使用一些 JQuery 代码来阻止
$('input[Type="Number"]').keypress(function (e) {
if ('0123456789'.indexOf(e.key) == -1) {
e.preventDefault();
}
});
这将影响所有数字类型的输入
【讨论】：
我在 React 中使用的一个简单解决方案。
onKeyDown={(evt) => ["e", "E", "+", "-"].includes(evt.key) && evt.preventDefault()}
【讨论】：
你可以检查它是否是一个数字。
// Restrict e, -, + for html input number
$(document).on('keypress', ':input[type="number"]', function (e) {
if (isNaN(e.key)) {
return false;
}
});
【讨论】：
JQuery
如果要接受小数（。）也可以使用以下代码
$('input[Type="Number"]').keypress(function (e) {
if ('0123456789'.indexOf(e.key)!=-1){}
else if (e.key=='.' && this.value!='' && (this.value.match("\.") || []).length==0){}
else{e.preventDefault();}
});
【讨论】：
这是基于其他一些解决方案的使用 jQuery 的非常简洁的解决方案：
$("input[type=number]").on("keydown", function(e) {
var invalidChars = ["-", "+", "e"]; //include "." if you only want integers
if (invalidChars.includes(e.key)) {
e.preventDefault();
}
});
【讨论】：
我不确定您的用例的详细信息，但您自己可能不需要做很多事情来处理这些。对于初学者，您可以设置一个min，它可用于防止负面影响，以及一个max 值和一个step 值（如果有用的话）。原来默认步长是 1，所以它需要整数，除非您指定小数步长值。
在处理数字中的“e”时，可以使用 Number() 将文本转换为数字，它会自动转换“e”以及任何“+”号：
> Number("5e3")
5000
> Number("+42")
42
如果您确实需要对提交的值进行规范化，您可以将其转换回原位。我认为可能对用户最友好的时间是模糊：
input.addEventListener('blur', () => {
if (input.value !== '' && input.checkValidity()) {
input.value = Number(input.value);
}
});
【讨论】：