Enable and disable button through remove attribute

This question already has an answer here:

Disable/enable an input with jQuery? 11 answers

---

Use .is(':checked') instead of checing the value. also replace :

$('#myButton').attr('disabled'); //Get the value

By :

$('#myButton').attr('disabled','disabled'); //Set the value

To set the value.

NOTE : you could do this using prop() instead :

$("#myButton").prop('disabled', !$(this).is(':checked'));

Hope this helps.

attr() / removeAttr() Snippet :

$(document).ready(function(){
  $('#myCheckBox').on('change',function(){
    if( $(this).is(':checked') ){
      $('#myButton').removeAttr('disabled');
    }else{
      $('#myButton').attr('disabled','disabled');
    }
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<label for="myCheckBox">
  I agree with terms and conditions
  <input type="checkbox" id="myCheckBox" />
</label>
<br />
<br />
<input type="button" id="myButton" value="Submit" disabled />

---

You're over thinking this a bit. First use .prop() not .attr() . Second, just set the disabled property to the opposite of the checkbox's state with:

  $('#myCheckBox').on('change', function() {
    $('#myButton').prop('disabled', !$(this).is(':checked'));
  })

$(document).ready(function() {
  $('#myCheckBox').on('change', function() {
    $('#myButton').prop('disabled', !$(this).is(':checked'));
  })
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<label for="myCheckBox">
  I agree with terms and conditions
  <input type="checkbox" id="myCheckBox" />
</label>
<br />
<br />
<input type="button" id="myButton" value="Submit" disabled />

---

You don't need to use attr('value') use this.checked instead to get checkbox status. Then use prop() method to set button status like following.

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

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<label for="myCheckBox">
  I agree with terms and conditions
  <input type="checkbox" id="myCheckBox" />
</label>
<br />
<br />
<input type="button" id="myButton" value="Submit" disabled />

链接地址: http://www.djcxy.com/p/23002.html

上一篇: 启用禁用的按钮

下一篇: 通过删除属性来启用和禁用按钮