如何根据被选中的复选框更改变量?

时间:2016-04-13 00:18:49

标签: javascript jquery checkbox

我有一个像这样的复选框......

 <input type="checkbox" id="something" name="something" value="25" data-val="25" checked="checked" class="option">
    <label for="something">Something</label>

我想拥有javascript / jquery代码,每次选中或取消选中该复选框时,它会查看是否选中了它,如果选中则指定值为25,如果未选中,则为0。但是,当我通过检查/取消选中进行测试时,它只是继续吐出25.当我取消选中时,为什么它不会变为0?我有什么想法吗?

$( document ).ready(function() {
    $('.option').on('change', function() {
       if ($('#something').attr('checked')) {
          var something = 25;
      } else {
          var something = 0;
      }
      console.log(something);
    });
});

1 个答案:

答案 0 :(得分:1)

.attr() 方法返回string &#34;已选中&#34; - 复选框的初始状态,其中没有&# 39; t更改
它始终被评估为trueif condition将始终运行。

  

要检索和更改DOM属性,例如已选中,已选中,   或禁用表单元素的状态,使用.prop()方法。

因此,使用 .prop() ,您可以获得true/false

$('.option').on('change', function() {
   var something;
   if ($(this).prop('checked')) {
        something=25;
      } 
    else {
        something = 0;
      }
        console.log(something);
 });

或者,如果使用 .is() 方法检查checkbox并返回boolean,则检查

$('.option').on('change', function() {
      var something;
       if ($(this).is(':checked')) {
          something=25;
      } else {
           something = 0;
      }
      console.log(something);
 });