Webkit浏览器中的复选框问题

时间:2013-11-29 22:36:58

标签: javascript jquery html checkbox

我的html中有很多复选框。某些复选框应取消选中其他复选框组。因此,其中一个复选框具有以下代码。

第一个版本是在Jquery`中

function uncheckmusic() {
    $(".buttons :checkbox").prop('checked',false);
}

$("#test").click(function() {
    uncheckmusic();
}

另一个版本是Javascript`

function uncheckmusic() {
    document.getElementById("first").checked = false;
    document.getElementById("second").checked = false;      
}

$("#test").click(function() {
    uncheckmusic();
}

所以问题如下。在Firefox中工作正常,但在webkit浏览器(例如Chrome)中存在一些我无法理解的问题。复选框不返回值或不更新。请帮我。

<div class="classexample">             
    <input id="test" name="yesmusic" class="toggle"  type="checkbox">                                     
</div>                       

<div class="buttons">                  
      <input id="first" name="checkbox1"  type="checkbox" class="toggle">
      <div id="checkbox1"><b>checkbox1</b></div>
</div>

<div class="buttons">                  
    <input id="second" name="checkbox2"  type="checkbox2" class="toggle">
    <div id="checkbox2"><b>checkbox2</b></div>                        
</div>

1 个答案:

答案 0 :(得分:0)

这对您有帮助,这是FIDDLE

<script>
$(function() {

  function uncheckmusic() {
    $('.buttons input[type="checkbox"]').prop('checked',false);
  }

  $('.buttons input[type="checkbox"]').click(function() {
    if($(this).is(':checked')) {
       $('.classexample input[type="checkbox"]').prop('checked',false);
    }
  });

  $('.classexample input[type="checkbox"]').click(function() {
    if($(this).is(':checked')) {
       uncheckmusic();
    }
  });

});
</script>