Javascript 选中jQuery不工作的所有复选框_Javascript_Jquery_Html

Javascript 选中jQuery不工作的所有复选框

javascript jquery html

Javascript 选中jQuery不工作的所有复选框,javascript,jquery,html,Javascript,Jquery,Html,我有这个问题，不明白为什么我的代码不能工作我想在单击Todas时选中所有复选框我用代码做了一个测试，它在那里工作，但在我的项目上运行时，它不工作，即使在检查时没有显示错误 jQuery函数来自另一个函数： html代码片段是： <div class="hide" id="states"> <div class="control-group"> <label class="control-label

我有这个问题，不明白为什么我的代码不能工作

我想在单击Todas时选中所有复选框

我用代码做了一个测试，它在那里工作，但在我的项目上运行时，它不工作，即使在检查时没有显示错误

jQuery函数来自另一个函数：

html代码片段是：

<div class="hide" id="states">
  <div class="control-group">                           
    <label class="control-label">Seleccione</label>
      <div class="controls">
        <label class="checkbox span4">
          <input type="checkbox" class="all" value="all" id="allstates" name="all"/>Todas
        </label>
        <label class="checkbox span4">
          <input type="checkbox" value="Caba" id="" name="st[]"/>Ciudad Autónoma de Buenos Aires
        </label>
        <label class="checkbox span4">
          <input type="checkbox" value="Buenos Aires" id="" name="st[]"/> Buenos Aires
        </label>
        <label class="checkbox span4">
          <input type="checkbox" value="Catamarca" id="" name="st[]"/> Catamarca
        </label>
        <label class="checkbox span4">
          <input type="checkbox" value="Chaco" id="" name="st[]"/> Chaco
        </label>
       </div>
  </div>
</div>

我错过什么了吗

编辑

通过检查发现我使用的模板将这些行添加到复选框中，这就是为什么这在我的代码中不起作用，但在fiddle上起作用

以下是一个片段：

<label class="checkbox span4">
    <div class="checker">
     <span><input type="checkbox" value="Buenos Aires" id="" name="st[]">
     </span>
    </div> Buenos Aires
</label>

因此，现在我仍在努力检查和取消检查元素…

尝试以下方法：

<html>
<head>
    <script type="text/javascript" src="JQ.js"></script>
    <script type="text/javascript">
        $(document).ready(function() {
            $('#allstates').click(function() {
            var c = this.checked;
            $(":checkbox").prop("checked", c);
            });
        });
    </script>
</head>
<body>
    <div class="hide" id="states">
      <div class="control-group">                           
        <label class="control-label">Seleccione</label>
          <div class="controls">
            <label class="checkbox span4">
              <input type="checkbox" class="all" value="all" id="allstates" name="all"/>Todas
            </label>
            <label class="checkbox span4">
              <input type="checkbox" value="Caba" id="" name="st[]"/>Ciudad Autónoma de Buenos Aires
            </label>
            <label class="checkbox span4">
              <input type="checkbox" value="Buenos Aires" id="" name="st[]"/> Buenos Aires
            </label>
            <label class="checkbox span4">
              <input type="checkbox" value="Catamarca" id="" name="st[]"/> Catamarca
            </label>
            <label class="checkbox span4">
              <input type="checkbox" value="Chaco" id="" name="st[]"/> Chaco
            </label>
           </div>
      </div>
    </div>
</body>
</html>

JQ是一个jQuery库版本1.11.1。

解决方案是找到另一个js文件添加的span标记，我正在使用基于引导的模板。因此，有效的代码是：

$('#allstates').click(function() {
  if($(this).attr("checked")){
    $('#states').find('span').addClass('checked');  
    $('#states').find('input').prop('checked',true);        
  }else{
    $('#states').find('span').removeClass('checked');
  }    
});

jQuery是在文档就绪调用中还是在文档底部？默认情况下，jsFiddle将代码包装在window.load中。我设置此复选框的文件是从另一个主文件调用的，所以是的。。。正在加载jquery我不理解您的评论。你能发一个链接到你的页面吗？@Luka-不，不会产生错误，它会自动失败。您在这里看到错误了吗？@j08691:当您试图在尚未加载的元素上注册事件或调用该元素上的方法时，就会出现错误。感谢卢卡的回答。检查我的编辑，你就会明白我的问题是…我刚刚发现

$('#allstates').click(function() {
  if($(this).attr("checked")){
    $('#states').find('span').addClass('checked');  
    $('#states').find('input').prop('checked',true);        
  }else{
    $('#states').find('span').removeClass('checked');
  }    
});