0

我有一系列复选框，我想每次都将文本值附加到 div 并选择项目，但我还想在取消选择项目时从 div 的文本中删除该项目。

我猜最好的方法是使用某种数组？我能得到一些关于这个的指导吗？

编辑：我应该提到这是一个 ASP.NET 复选框列表（我的错），所以我的输出看起来像这样：

<div id="ctl00_ContentPlaceHolder1_divServices" style="width:450px; height:250px; overflow-y:scroll;">
                    <table id="ctl00_ContentPlaceHolder1_chklstServices" border="0">
<tr>
    <td><input id="ctl00_ContentPlaceHolder1_chklstServices_0" type="checkbox" name="ctl00$ContentPlaceHolder1$chklstServices$0" onclick="ToggleBGColour(this);" /><label for="ctl00_ContentPlaceHolder1_chklstServices_0">Adhesives & Sealants</label></td>
</tr><tr>
    <td><input id="ctl00_ContentPlaceHolder1_chklstServices_1" type="checkbox" name="ctl00$ContentPlaceHolder1$chklstServices$1" onclick="ToggleBGColour(this);" /><label for="ctl00_ContentPlaceHolder1_chklstServices_1">Air Ambulance</label></td>
</tr><tr>
    <td><input id="ctl00_ContentPlaceHolder1_chklstServices_2" type="checkbox" name="ctl00$ContentPlaceHolder1$chklstServices$2" onclick="ToggleBGColour(this);" /><label for="ctl00_ContentPlaceHolder1_chklstServices_2">Air Charter</label></td>
</tr>
</table>
</div>
<div id="selectedServices"></div>

我实际上正在尝试完成两件事：

1）当复选框被切换（完成此位）时对单元格背景颜色着色（或删除颜色） 2）当复选框被选中/取消选中时附加或删除所选项目的文本

我的 javascript/jquery 代码：

function ToggleBGColour(item) {

    var td = $(item).parent();      

    if (td.is('.rowSelected'))      
        td.removeClass("rowSelected");      
    else        
        td.addClass("rowSelected");     

}
4

1 回答 1

3

您可以使用.map()and Array.join()，如下所示：

$(":checkbox").change(function() {
  var arr = $(":checkbox:checked").map(function() { 
              return $(this).next().text();  //get the <label>'s text
            }).get();
  $("#myDiv").text(arr.join(','));
});

每当复选框更改时，它将遍历所有选中的复选框，创建其值的数组，然后将其作为逗号分隔的字符串放入<div>.

这当然是一个示例，只需将选择器更改为您关心的复选框即可。 你可以在这里试一试。

于 2010-08-17T17:28:09.580 回答