javascript - 在选中的复选框上设置属性，否则删除属性

Question

我正在尝试更改按钮上的 disabled 属性，以防复选框:

<input type="checkbox" id="terms" class="styled" name="terms">Accept <a href="#">terms of service</a>

将被检查，应删除disabled属性，否则它应保留在按钮元素上。

我按照以下方式让它工作:

if(document.getElementById('terms').checked) {
    $("#registerButton").removeAttr('disabled');
}else{
    $("#registerButton").attr('disabled','disabled');
}

遗憾的是这只能工作一次。一旦我选中复选框，按钮就不会改变。有没有这样的函数，就是onchange编辑按钮？

Answer 1

您可以按照以下方式进行操作。

$('#terms').change(function() {
    $("#registerButton").prop('disabled', !this.checked);
}).change();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="checkbox" id="terms" class="styled" name="terms">Accept <a href="#">terms of service</a>

<button id="registerButton">Register</button>