我试图禁用提交按钮,直到用户填写了表单中的输入字段。
我在这里找到了THIS线程,它的回答非常好。在填写字段时,让提交按钮重新启用时,我遇到了一个小问题。
有人可以看看这个功能,并帮助我弄清楚我所缺少的吗?
任何帮助将不胜感激:D
谢谢你。
Heres a Fiddle也
$(document).ready(function() {
var $submit = $("input[type=submit]");
if ( $("input:empty").length > 0 ) {
$submit.attr("disabled","disabled");
} else {
$submit.removeAttr("disabled");
}
});
<form method="POST" action="<%=request.ServerVariables("SCRIPT_NAME")%>">
User Name: <input name="Username" type="text" size="14" maxlength="14" /><br />
Password: <input name="last_name" type="password" size="14" maxlength="14"><br />
<input type="submit" value="Login" name="Submit" id="loggy">
</form>
最佳答案
$(document).ready(function() {
var $submit = $("input[type=submit]"),
$inputs = $('input[type=text], input[type=password]');
function checkEmpty() {
// filter over the empty inputs
return $inputs.filter(function() {
return !$.trim(this.value);
}).length === 0;
}
$inputs.on('blur', function() {
$submit.prop("disabled", !checkEmpty());
}).blur(); // trigger an initial blur
});
Working sample
除了模糊之外,您还可以使用keyup:
$inputs.on('keyup', function() {
$submit.prop("disabled", !checkEmpty());
}).keyup(); // trigger an initial keyup
您还可以组合多个事件:
$inputs.on('keyup blur', function() {
$submit.prop("disabled", !checkEmpty());
}).keyup(); // trigger any one