2

我有一长串带有特定标签的复选框，如下所示：

<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 中的标签必须向上移动。有谁知道这是否可能？

4

3 回答 3

2

试试这个：

   $(function(){
    $('input:checkbox').click(function(){
       var id = $(this).attr('id');
        if($(this).is(':checked')){
            $('#member1').text($('label[for="'+ id +'"]').text());
        }
        else{
            $('#member1').text('');   
        }
    });
    });

   $(function(){
    $('input:checkbox').click(function(){
       var id = $(this).attr('id');
        if($(this).is(':checked')){
          if($('#memebr1').text() == "") {
            $('#member1').text($('label[for="'+ id +'"]').text());
          } else {
            $('#member2').text($('label[for="'+ id +'"]').text())
          }
        }
        else{
            $('#member1').text('');   
        }
    });
    });
于 2012-06-20T11:44:03.590 回答
1 
$(function(){
$('input[type=checkbox]').click(function(){
    if($(this).is(':checked')){
        $('#member1').text($('label[for="'+$(this).attr("id")+'"]').text());
    }
    else{
        $('#member1').text('');   
    }
});
});
于 2012-06-20T11:45:14.527 回答
1

试试这个。

现场演示

   $(function() {

    $('input[type=checkbox][name=check\[\]]').click(function() {
        chkboxid = $(this).attr('id');
        if ($(this).is(':checked')) {

            $('#member' + eval($(this).index() + 1)).text($('label[for="' + chkboxid + '"]').text());

        }
        else {
            $('#member' + eval($(this).index() + 1)).text('');
        }
    });
});​
于 2012-06-20T12:11:35.343 回答