我有两套复选框。当第一个div的复选框被选中时,它将通过ajax调用获取数据并填入第二个div。选中另一个复选框后,它将附加到第二个div。但是,如果未选中第一个div的复选框,则必须删除附加的复选框列表。我从没想过会这么难!有人可以帮帮我吗?
触发ajax调用的第一个表
<table class="large-7 large-centered columns"><tr>
<?php
$i=0;
while($row = $stmt->fetch(PDO::FETCH_ASSOC))
{
$i++;
//echo $i;
?>
<td>
<label for="level_<?php echo $row['catid'];?>">
<input type="checkbox" class="level" id="level_<?php echo $row['catid'];?>" value="<?php echo $row['catid'];?>">
<span></span>
<?php echo $row['catname'];?>
</label>
</td>
<?php
if($i==2)
{
echo"</tr><tr>";
$i=0;
}
}
?>
</tr></table>
其次,附加清单
<div class="small-12 medium-12 large-7 large-centered columns" id="show_subjects">
<table>
<?php
while($row = $statement->fetch())
{
$levels=$row['catname'];
$levels_id=$row['catid'];
$subjects= $row['subname'];
$subjects_id= $row['subid'];
if($last_category != $levels)
{
$last_category = $levels;
?>
<tr><th class="subjects"><?php echo $levels;?>
<?php
}
?>
<table>
<tr>
<td><?php echo $subjects;?></td>
<td>
<label for="<?php echo $subjects_id;?>">
<input type="checkbox" class="sub" name="sub[<?php echo $subjects_id;?>]" id="<?php echo $subjects_id;?>" value="">
<span></span>
<?php echo $subjects;?>
</label>
</td>
</tr>
</table>
<?php
if($last_category != $levels)
?>
</th></tr>
<?php
}
?>
</table>
</div>
脚本
$("input[type=checkbox][id^=level]").on("change",function()
{
var selectedval = $(this).val();
if($(this).is(":checked")) {
var t=this.id;
//alert("click " + t);
var nowshow=t.split("level_").join("");
fetchSub(nowshow);
}
else {
var me=$("th.subjects");
var remove_id=this.id;
//alert($id);
$("th"+selectedval).remove();//This is where I wish to know how to remove
}
});
HTML,如第二个复选框的Inspect元素
<table>
<tbody>
<tr>
<th class="subjects">...
<table>
<tbody>
<tr>
<td></td>
<label for="5">
<input type="checkbox" class="sub" name="sub[5]" id="5" >
<span></span>
</label>
</td>
</tr>
</tbody>
</table>
</th>
</tr>
</tbody>
</table>