单击动态生成的复选框的事件 [英] Click events of Dynamically generated Checkboxes

问题描述

大家好。我正面临着一些与JQuery有关的奇怪问题。让我详细解释一下。



我从DB获得了一些数据并基于它生成了父子复选框。我在页面上有一个 div 。我为每个父子群生成一个 div ，并将每个生成的 div 附加到已经在页面上的div 。所以在完成所有这些之后，我得到了与此相似的内容： 示例图像[不是实际的]



现在，请看图像。我有类似的布局。你可以考虑每个水果类别与所有孩子都在一个 div 。



我正在尝试的是，检查所有功能。如果我选中父复选框，则会检查所有孩子。它工作正常，问题是它第一次工作。如果我取消选中并再次检查（父），它不会检查所有孩子。我试着在浏览器中调试它。它显示在浏览器中检查，但在UI中未选中。代码如下所示：

  for （k =  0 ; k <  ParentCount; k ++）{
 $（  ＃parentchk + k）.on（' 点击'，功能（）{
 如果（$（ this  ）。是（' ：checked' ））{ //  如果选中父级 
 $（ this ）。parent（）。find（'  input：checkbox'） .each（function（）{ //  为此获取Div捆绑并遍历所有复选框 
 $（ this ）。attr（'' 选中'，' 选中'） ; 
}）; 
} 
  else  {
 $（ this ）。parent（ ）.find（'  input：checkbox'）。each（function（）{
 $ （ this ）。removeAttr（'  checked'）; 
}）; 
} 
}）; 
} 
 

此代码位于动态生成复选框的功能下。我无法确定问题的原因。


有谁可以识别？如果您需要更多详细信息或任何事情仍然不清楚，请告诉我。

解决方案

（ ＃parentchk + k）.on（' click'，function（）{
if （

（ this ）。 （' ：checked' ））{ // 如果选中父级

< blockquote>（ this ）。parent（）。find（' 输入：复选框'）。each（function（）{ // 获取此组的Div和循环遍历所有复选框

Hello all. I am facing some strange issue with JQuery. Let me explain it in detail.

I got some data from DB and based on it i generated parent child checkboxes. I have single div on page. I generate one div for every parent child bunch and attach each of the genrated div to the div that is already on the page. So after doing all this, i got something similar to this one : Example image[Not actual one]

Now,see the image. I have similar layout.You can consider that Each fruits category with all the childs are under one div.

What i am trying is,Check all functionality. if i check Parent checkbox,all the children will get checked. Its working fine,the issue is its working only first time. If i uncheck and recheck again(parent),it doesnt checks all the children. I tried to debug it in browser. It shows checked in Browser,but in UI its unchecked.The code is as shown below:

for (k = 0; k < ParentCount; k++) {
           $("#parentchk" + k).on('click', function () {
               if ($(this).is(':checked')) {//if parent is checked
                   $(this).parent().find('input:checkbox').each(function () {//get the Div for this bunch and loop through all the checkboxes
                       $(this).attr('checked', 'checked');
                   });
               }
               else {
                   $(this).parent().find('input:checkbox').each(function () {
                       $(this).removeAttr('checked');
                   });
               }
           });
       }

This code is under the function which dynamically generates the Checkboxes. I am unable to identify the cause of issue.

Anyone there who can identify? Let me know if you need more details or anything is still not clear.

解决方案

("#parentchk" + k).on('click', function () { if (

(this).is(':checked')) {//if parent is checked

(this).parent().find('input:checkbox').each(function () {//get the Div for this bunch and loop through all the checkboxes

这篇关于单击动态生成的复选框的事件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！