下面我试图确保在允许用户提交之前我的复选框和输入都已填满。它会忽略我对复选框的检查,并在仅填写字段后打开提交。我做错了什么?
$('#first, #last, #pass').bind('keyup', function() {
if (allFilled()) $('#register').removeAttr('disabled');
});
function allFilled() {
var filled = true;
console.log($('#checkbox').prop('checked'))
$('body input').each(function() {
if ($(this).val() == '' && $('#checkbox').prop('checked') == false) filled = false;
});
return filled
};
HTML:
<body>
<form>
Username
<br />
<input type="text" id="first" name="first" />
<br /> First
<br />
<input type="text" id="last" name="last" />
<br /> Last
<br />
<input type="text" id="pass" name="pass" />
<br /> Password
<br />
<input type="checkbox" class="checkbox" id="checkbox" name="checkbox" />
<br />
<input type="submit" id="register" disabled value="Register" />
</form>
<div id="test">
</div>
</body>
答案 0 :(得分:1)
从jQuery 3.0开始,.bind()已被弃用。它被.on()方法取代,用于将事件处理程序从jQuery 1.7附加到文档,因此不鼓励使用它。
$('#first, #last, #pass').on('keyup', function() {
if (allFilled()) $('#register').removeAttr('disabled');
});
希望这有帮助。
$('#first, #last, #pass').on('keyup', function() {
if (allFilled()) $('#register').removeAttr('disabled');
});
function allFilled() {
var filled = true;
$('body input').each(function() {
if ($(this).val() == '' && $('#checkbox').prop('checked') == false) filled = false;
});
return filled
};
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form>
Username
<br />
<input type="text" id="first" name="first" />
<br /> First
<br />
<input type="text" id="last" name="last" />
<br /> Last
<br />
<input type="text" id="pass" name="pass" />
<br /> Password
<br />
<input type="checkbox" class="checkbox" id="checkbox" name="checkbox" />
<br />
<input type="submit" id="register" disabled value="Register" />
</form>
<div id="test">
</div>