Question

我的代码中有一个提交按钮，并且已禁用..我需要在用户点击＆＃34;我同意＆＃34;复选框..我需要它在jQuery ..任何人都可以帮助我吗？我用html，javascript和jquery编写代码。

 <input id="agree" type="checkbox" name="agree" >I agree to the terms of      service...<br> <br />
     <div align="center">
     <button  style=" color: white; background-color: gray; width: 100px; height: 30px" type="submit" disabled ><b><font color="black">Register</font></b></button>
    </div>

Answer 1

当复选框的状态发生变化时，请根据复选框设置按钮的disabled属性。现状：

$('#agree').on('change', function() {
  $('button').prop('disabled', !this.checked);
});

如果页面上有多个按钮，则上面将在所有按钮上设置disabled属性。如果你需要获得相对于#agree的下一个按钮，你必须稍微遍历一下：

$('~ div:first', this).find('button').prop('disabled', !this.checked);

$('~ div:first', this)将首次出现div this之后的#agree

Here's a fiddle

Answer 2

您可以使用：

$('#agree').click(function() {
    $('input[type="submit"]').prop('disabled',!this.checked);
});

或：

$('#agree').click(function() {
    $(this).next().find('input[type="submit"]').prop('disabled',!this.checked);
});

Answer 3

试试这个..当Checkbox状态改变时按钮的属性改变......

$('#agree').click(function() {
    $('input[type="submit"]').prop('disabled',!this.checked);
});

<强> Demo Fiddle

Answer 4

 $('input[type="submit"]').removeAttr('disabled');

Answer 5

$("#checkBoxID").click(function() {
  $("#buttonID").attr("disabled", !this.checked);
});

所以在你的情况下

$("#agree").click(function() {
  $("button").attr("disabled", !this.checked);
});

Demo

Answer 6

这样做

$('#agree').change(function() {

       $('button[type=submit]').prop('disabled', !this.checked);

});

Answer 7

我知道你想要一个JS解决方案，但只是为了展示一种不同的方法，你可以在纯CSS中实现类似的东西。

请注意，您还应该避免使用font标记，并将CSS从内联移动到样式表。

Demo Fiddle

HTML

<input id="agree" type="checkbox" name="agree">I agree to the terms of service...
<div>
    <button>Register</button>
    <div></div>
</div>

CSS

div {
    position:relative;
    text-align:center;
}
div div {
    height:100%;
    position:absolute;
    top:0;
    left:0;
    width:100%;
}
button {
    background:grey;
    color:#c0c0c0;
}
input[type=checkbox]:checked + div div {
    display:none;
}
input[type=checkbox]:checked + div button {
    background:#c0c0c0;
    color:black;
}

选中复选框后启用按钮

7 个答案:

Here's a fiddle

Demo Fiddle