我有一长串带有特定标签的复选框,如下所示:
<input type='checkbox' name='check[]' id='159' value='159' />
<label for='159'>Person 1</label>
<input type='checkbox' name='check[]' id='160' value='160' />
<label for='160'>Person 2</label>
在这个表格下面我有六个像这样的div:
<div id="member1" class="member"></div>
<div id="member2" class="member"></div>
<div id="member3" class="member"></div>
<div id="member4" class="member"></div>
<div id="member5" class="member"></div>
<div id="member6" class="member"></div>
有人帮我写了这个 JS 函数,这样当我点击一个复选框时,它的标签就会插入到第一个 div 中。这是它的样子:
$(function(){
$('#159').click(function(){
if($(this).is(':checked')){
$('#member1').text($('label[for="159"]').text());
}
else{
$('#member1').text('');
}
});
});
问题是我不知道如何编辑此功能以适用于任何单击的复选框。目前它仅适用于 id 为 159 的复选框。第二个问题是该函数指定将其放入的 div。这个想法是,当第一个 div 为“满”时,下一个复选框会将标签插入第二个 div,然后是第三个,依此类推。
请注意,如果未选中该复选框,则标签将从 div 中删除,并且其下方 div 中的标签必须向上移动。有谁知道这是否可能?