Question

当我遍历带有类.category附件的所有复选框并尝试更改复选框的可视输出以进行检查时，没有任何反应。变量'state'返回true或false，用于更改元素当前的可视输出。在这个时刻没有任何反应，我不知道为什么。

HTML：

<input type="checkbox" class="category">checky 1</span>
<input type="checkbox" class="category">checky 2</span>
<input type="checkbox" class="category">checky 3</span>

JS：

$('body').on('click','.category',click);

function click(){
  $('.category').each(function(i,element){
    var state = $(element).prop('checked');
    $(element).prop('checked', state);
  });

  return false;
}

提前致谢。

Answer 1

请注意，没有任何反应，因为您在事件处理程序中使用return false。这将阻止（取消）选中复选框。

如果您尝试实施全选选项，请执行以下操作：

$(".category:first").on("click", function() {
  $(".category").prop("checked", this.checked);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<label><input type="checkbox" class="category"/> Select all</label><br>
<label><input type="checkbox" class="category"/></label><br>
<label><input type="checkbox" class="category"/></label><br>
<label><input type="checkbox" class="category"/></label><br>
<label><input type="checkbox" class="category"/></label><br>
<label><input type="checkbox" class="category"/></label><br>
<label><input type="checkbox" class="category"/></label><br>

Answer 2

尝试此选项以设置复选框。

$('body').on('click','.category',click);

function click(){
  $('.category').each(function(i,element){
    element.value='checked';
  });

  return false;
}

Answer 3

试试这段代码：

$('body').on('click','.category',click);

function click(){
  $('.category').each(function(i,element){
    var state = $(element).prop('checked');
    $(element).prop('checked', state ? '' : 'checked');
  });

  return false;
}

Answer 4

如果对代码执行测试，您将看到尝试抓取元素的方式不正确。 Class＆＃34; category＆＃34;不存在。你拥有的是＆＃34; category-desktop＆＃34;。所以，如果你这样测试：

alert($( 'input' ).hasClass( "category" ));//False
alert($( 'input' ).hasClass( "category-desktop" ));//True

我认为你正在尝试这样做：

$('body .category-desktop').on('click',function(){
alert("click ok");
    //run your function
});

请参阅小提琴http://jsfiddle.net/yruhL69v/4/

但是要完成代码，我需要了解是否要点击任何复选框，或者点击正文上的任何位置，或任何具有类别 - 桌面平衡体的元素。

jQuery：将复选框的视觉输出更改为选中

4 个答案: