webkit浏览器中的复选框问题

Checkboxes issue in webkit browsers

本文关键字:复选框 问题 浏览器 webkit      更新时间:2023-12-12

我的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>

这对您有帮助吗?这里有一个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>