Question

我有一系列复选框，这些复选框是从.csv文件中读取时动态创建的。在完成一系列复选框后，添加另一个复选框，即“全选”。我们的想法是，选中“全部选中”复选框（也会在选中时动态创建）将检查其上方的所有复选框。每个复选框都设置为将其名称属性放在textarea下面。

以下是从csv文件中提取>后HTML的外观示例。

<div class="checkboxes">
   <input type="checkbox" class="article" name="Article 1" />Article 1 <br>
   <input type="checkbox" class="article" name="Article 2" />Article 2 <br>
   <input type="checkbox" class="select-all" name="select-all" />Select all
</div>
<textarea></textarea>

现在我在文章复选框上使用.delegate并选择-all来注册点击事件

 //clicking dynamically created input.article
 $('div.checkboxes').delegate('input.article','click',function(){
     $('textarea').val($(this).attr('name') + '/n');  //adds 'name' attr and a linebreak
 });

 //clicking dynamically created select-all
 $('div.checkboxes').delegate('input.select-all','click',function(){
     $('div.checkboxes').find('input.article').prop('checked',true); //works to select all articles
 });

问题是，即使'select-all'确实检查了所有文章复选框，它实际上并没有触发该行：

    $('textarea').val($(this).attr('name') + '/n');  //adds 'name' attr and a linebrea

name属性未放在textarea中。

同样，“Select-all”正在检查所有文章复选框。这只是'触发''点击'事件。

在textarea中，理想情况下会显示：

第1条

第2条

如何实现这一目标？

感谢您的帮助。

解决：

  $('div.checkboxes').delegate('input.select-all','click',function(){

       if ($(this).is(':checked')){

      $('input.article[type=checkbox]').prop('checked',true);   
      $('input.article[type=checkbox]').each( function(){
        $(this).trigger('click');
      });
       }
  });

Vielen Dank。

Answer 1

执行这些操作的方法很多，但这里只是对代码的简单更改：

 //clicking dynamically created input.article
 $('div.checkboxes').delegate('input.article','click',addname);

function addname(){
     $('textarea').val($(this).attr('name') + '/n');  //adds 'name' attr and a linebreak
};

 //clicking dynamically created select-all
 $('div.checkboxes').delegate('input.select-all','click',function(){
     $('div.checkboxes').find('input.article').prop('checked',true); //works to select all articles
     addname();
 });

注意 - 我注意到你似乎错过了很多;，这是一个复制错误还是你在代码中遗漏了它们？

触发＆＃39;点击＆＃39;动态数据事件

1 个答案: