单击复选框jQuery时禁用/启用输入

I'm attempted to only allow the submit button in a form to be enabled when a user has checked off a checkbox. I've gotten the button to start disabled, then become enabled when the checkbox is initially clicked on, but if I then uncheck the checkbox, the button doesn't become re-enabled.

我试图只允许在用户选中复选框时启用表单中的提交按钮。我已经启动禁用按钮,然后在最初单击复选框时启用,但如果我取消选中该复选框,则按钮不会重新启用。

HTML:

<input type="checkbox" id="waivercheck">
<input class="submit join-button" type="submit" value="Join Now" id="joinevent" disabled>

Script:

$(document).ready(function() {
    $('#waivercheck').click(function(){
        if($(this).checked){
            $('#joinevent').prop("disabled",false);   
        } else {
            $('#joinevent').prop("disabled",true);
        }
    });
});

Can anyone help?

有人可以帮忙吗?

3 个解决方案

#1

You can access the checkbox status via this.checked and not $(this).checked. And I recommend using the change event.

您可以通过this.checked访问复选框状态,而不是$(this).checked。我建议使用更改事件。

$(document).ready(function() {
    $('#waivercheck').change(function(){        
        if(this.checked){
            $('#joinevent').prop("disabled",false);   
        } else {
            $('#joinevent').prop("disabled",true);
        }
    });
});

Demo: https://jsfiddle.net/rbnndz23/

#2

Your issue is with the conditional.

你的问题是有条件的。

A jQuery object doesn't have a checked property but the DOM element itself does

jQuery对象没有checked属性,但DOM元素本身没有

Instead of

if($(this).checked)

Can do

// native element has checked property
if(this.checked)

// jQuery is() with pseudo selector
if($(this).is(':checked'))

#3

You don't need to use $(this).checked. Instead try using this.checked. See here.

您不需要使用$(this).checked。而是尝试使用this.checked。看这里。

#1