Javascript 就这样吧'；进入'；按键可按

我有一个基本表单，这样用户就不能在表单发布页面之前将输入字段留空。它还可以防止用户输入胡言乱语，并要求他们只输入数字，但这也会阻止所有非数字键，包括移动键盘上的Go/enter键。我的问题是，有没有办法让用户只需输入数字，而且在输入字段后还可以按Go键

小提琴：

目前，用户必须输入一个zip，然后在屏幕上点击后退，然后单击提交

    $(document).ready(function () {
        $("#quantity").keypress(function (e) {
            if (e.which != 8 && e.which != 0 && (e.which < 48 || e.which > 57)) {
                $("#errmsg").html("Enter Valid Zip!").show().fadeOut("5000");
                return false;
            }
        });
    });

    var initVal = "Have a good name for it? Enter Here";
    $(document).ready(function () {
        $(".submit-name").attr("disabled", "true");
        $(".recipe-name").blur(function () {
            if ($(this).val() != initVal && $(this).val() != "") {
                $(".submit-name").removeAttr("disabled");
            } else {
                $(".submit-name").attr("disabled", "true");
            }
        });
    });
input {
    width: 100%;
    background: #FFFFFF;
    border-radius: 4px;
    border: 2px solid #acd50b;
    padding: 10px 15px;
    text-align: center;
    -webkit-appearance: none;
    color: #999999;
    font-size: 11px;
}
input[type="focus"] {
    outline: none;
}
input[type="submit"] {
    border-radius: 4px;
    border: 2px solid #2d8b1b;
    -webkit-appearance: none;
    background: #acd50b;
    padding: 6px 10px;
    color: #444444;
    width: 100%;
    font-size: 18px;
    cursor:pointer;
}
.box {
    width: 85px;
}
.boxtwo {
    width: 160px;
}
<form action="google.html" method="get" id="recipename">
    <div class="box">
        <input onFocus="this.value=''" type="text" value="Enter Your Zip" placeholder="Enter Your Zip" /><span id="errmsg"></span>

    </div>
    <div class="boxtwo">
        <input type="submit" value="Compare" id="register" disabled value="Compare" class="submit-name" />
    </div>
</form>

$（文档）.ready（函数（）{
$（“#数量”）。按键（功能（e）{
如果（e.which！=8&&e.which！=0&&e.which<48 | e.which>57））{
$（“#errmsg”）.html（“输入有效的Zip！”）.show（）.fadeOut（“5000”）；
返回false；
}
});
});
var initVal=“有好名字吗？在这里输入”；
$（文档）.ready（函数（）{
$（“.submit name”）.attr（“禁用”、“真实”）；
$（“.recipe name”）.blur（函数（）{
if（$（this.val（）！=initVal&$（this.val（）！=“”）{
$（“.submit name”）.removeAttr（“已禁用”）；
}否则{
$（“.submit name”）.attr（“禁用”、“真实”）；
}
});
});
输入{
宽度：100%；
背景：#FFFFFF；
边界半径：4px；
边框：2个实心#acd50b；
填充：10px 15px；
文本对齐：居中；
-webkit外观：无；
颜色：#999999；
字体大小：11px；
}
输入[type=“focus”]{
大纲：无；
}
输入[type=“submit”]{
边界半径：4px；
边框：2px实心#2d8b1b；
-webkit外观：无；
背景：#acd50b；
填充：6px 10px；
颜色：#4444；
宽度：100%；
字号：18px；
光标：指针；
}
.盒子{
宽度：85px；
}
B.第二箱{
宽度：160px；
}

最好使用keydown并测试结果值并将其还原，而不是只允许插入某些字符

$("#quantity").keydown(function (e) {
    var self = this;
    var tempVal = this.value;
    setTimeout(function () {
        if (!isValidZip(self.value)) {
            self.value = tempVal;
        }
    }, 0);
});

function isValidZip(zip) {
    return /^[0-9]{1,5}$/.test(zip);
}

这也可以通过keyup或keypress来完成，但是keydown使其发生得更快，并允许您轻松获取以前的值

---

这样做可以避免通过不测试按下的键来阻止完成键的问题。通过简单地更改regexp以匹配不同类型的邮政编码，它也很容易扩展。

假设邮政编码都是相同的长度，那么您可以检查输入字符串的长度并将其跳出。如果这不是一个好的选择，那么你需要查看手机API，找出“go/next”按钮是如何可用的。连接错误的小提琴，它现在工作了。与答案无关，但你应该使用

$（）.prop（'disabled'，true | false）

而不是

removeAttr（“disabled”）

和

attr(“disabled”、“true”）

。一方面，disabled属性的正确值是“disabled”、“true”或“nothing”。另一方面，添加或删除HTML元素的属性可能不会影响DOM。