我正在制作一个模态弹出窗口,我会动态添加一些数据,以及一些复选框。在某个部分有一个“选择所有”复选框的复选框,它可以正常工作,除非我选中“全选”复选框,除非我双击它,这实际上两次点击了点击功能。
$('#delAllSampleTwo').live('click',function(){
$('.delAllSampleTwo').prop("checked", !$('.delAllSampleTwo').prop("checked"));
$('.delTwo').prop("checked", !$('.delTwo').prop("checked"));
});
.delTwo类代码正常工作。但不是delAllSampleTwo,是的,它们的ID和类是相同的,我尝试使用id或只是类,但无法让它正常工作。
这是从JQuery代码返回的HTML字符串;
<table style=\'width: 685px;\' cellpadding=\'0\' cellspacing=\'0\'>
<tr>
<td style=\'width:20px;\'><a href=\'#\' class=\'toggleReportTwo\'></a></td>
<td style=\'width:315px; text-align:left; font-weight:bold;\'>Sample Report Two</td>
<td style=\'font-weight:bold; width:140px; text-align:right;\'>10/3/2013,9:52:40 AM</td>
<td style=\'font-weight:bold; width:150px; text-align:left; padding-left:6px;\'>
<a href=\'#\' class=\'viewIndReports\'>View All in One PDF</a>
</td>
<td style=\'width:70px;\'>
<input type=\'checkbox\' id=\'delAllSampleTwo\' class=\'delAllSampleTwo\'/>All
</td>
</tr>
</table>
<div id=\'sampleTwoReports\'>
<table style=\'width: 685px;\' cellpadding=\'0\' cellspacing=\'0\'>
<tr>
<td style=\'width:20px;\'></td>
<td style=\'width:315px; text-align:left;\'>CHIN KIM</td>
<td style=\'width: 140px; text-align:right; padding-right:4px;\'> </td>
<td style=\'width:150px; text-align:left; padding-left:6px;\'>
<a class=\'viewIndReports\' href=\'#\' target=\'_blank\'>View</a>
</td>
<td style=\'width:70px;\'>
<input type=\'checkbox\' id=\'delCHIN KIM\' class=\'delTwo\'/>
</td>
</tr>
</table>
</div>
答案 0 :(得分:0)
我明白了,这就是我最终做的事情。首先,我读了一些关于什么时候动态添加元素到一个模态的帖子,而不是z-index可能会被抛弃去除功能所以我将模态z-index设置为99999并重写该函数;
$('.delAllSampleTwo').live('click',function(){
if($(this).is(":checked")){
$('.delTwo').prop("checked",true);
}else{
$('.delTwo').prop("checked",false);
}
完美地完成了这个技巧。