Jquery重复动态复选框无效

时间:2017-01-06 14:11:59

标签: jquery html forms checkbox

我在每个游戏夹具中创建动态表单,以便他们可以邀请玩家。 在创建团队表时,我取名并创建一个列表。

/* Get team players information */
                    if (data.team_members){
                        $.each(data.members,function(index,item){
                            if (data.r_id <= 2){
                                members += '<tr class="refresh"><td style="padding: 0.20em;">'+
                                '<a href="#">'+item.forename+'  '+item.surname+'</a>'+
                                '</td><td style="padding: 0.20em;">'+item.role;
                            }else{
                                members += '<tr class="refresh">'+
                                    '<td style="padding: 0.20em;">'+item.forename+' '+item.surname+'</td>'+
                                    '<td style="padding: 0.20em;">'+item.role;
                            }
                            if (item.r_id == 3){
                                invite += '<li>'+item.forename+' '+item.surname+
                                    '<input type="checkbox" id="check'+i+'" name="invites[]" value="'+item.p_id+'" checked/>'+
                                    '<label style="float:right;" for="check'+i+'">&nbsp;</label></li>'; 
                            i++;
                            }
                            members += '</td></tr>';

                        });
                        $("#team_list > tbody:last-child").append(members);
                    }

问题是复选框,我创建了 var邀请,并且所有玩家的名字都进入了变量。 稍后在代码中我添加动态表单

f +='</center></td></tr><tr><td class="invite_form-'+i+'" style="display:none;">'+
                                    '<form id="iForm'+i+'" name="addIForm'+i+'"><ul class="alt">'+invite+'</ul>'+
                                    '<a href="#" id="submitInvite'+i+'" class="button submitInvite fit small">Submit</a>'+
                                    '</form></td></tr>';
                                i++;
                            }

页面加载,我可以打开表单。第一个表单有效,我可以单击复选框。当我打开第二个表单时,复选框会单击第一个表单。

我假设它是因为复选框id&#39; s。有没有人以前遇到过这个问题。

1 个答案:

答案 0 :(得分:0)

将其更改为Json数组

if (item.r_id == 3){
                                tmp ={  'fore': item.forename,
                                        'sur': item.surname,
                                        'p_id': item.p_id
                                     }
                                jsonObj.push(tmp);
                            }

然后我循环json并为每个创建的复选框增加id,所以我创建的数量无关紧要

f +='</center></td></tr><tr><td class="invite_form-'+i+'" style="display:none;">'+
                                    '<form id="iForm-'+i+'" name="addIForm-'+i+'"><ul class="alt">';
                                $.each(jsonObj, function(index, item) {
                                    f += '<li>'+item.fore+'<input type="checkbox" id="check-'+m+'" name="invites[]" value="" checked/>'+
                                    '<label style="float:right;" for="check-'+m+'">&nbsp;</label></li>';
                                    m++;
                                });
                                f += '</ul>'+
                                    '<a href="#" id="submitInvite-'+i+'" class="button submitInvite fit small">Submit</a>'+
                                    '</form></td></tr>';
                                i++;
                            }

这次是我如何解决这个问题