jquery - 删除 Div 并获取隐藏字段值 - 最佳方法

Question

我有以下 HTML 示例

<div id="TestDiv_0">
  <input id="hf_0" type="hidden" value="0">
  <span class="checkBox checked">
</div>
<div id="TestDiv_1">
  <input id="hf_1" type="hidden" value="10">
  <span class="checkBox checked">
</div>
<div id="TestDiv_2">
  <input id="hf_2" type="hidden" value="23">
  <span class="checkBox">
</div>

动态 HTML 并且可能会增长

我正在尝试使用 JQUERY 实现一些逻辑。

场景是如果跨度检查了类。我需要实现两件事

1. 在逗号分隔字段中获取type="hidden" 值（如果选中了多个跨度）。例如：在上面的 HTML 中，我需要在变量中获取 0,10

2. 删除特定的 Div。例如：在上面的 HTML 中，我需要删除 TestDiv_0、TestDiv_1。

实现这一点的最佳方法是什么？我尝试获取 div 的计数并循环查找类并删除了 Div。但认为会有一些更好的方法。

Answer 1

var arr = $('span.checked').map(function(){
     var id = $(this).siblings("input[type='hidden']").val(); 
     $(this).closest('div').remove();
     return id;
}).get().join(',');

演示--> http://jsfiddle.net/pEnDY/

Answer 2

演示

var checkedItems=[];
function handleChecked(){
    $("span.checked").each(function(){
        checkedItems.push($(this).siblings("input[type='hidden']").val());
        $(this).parent().remove();
    });
    console.log(checkedItems);
}
handleChecked();

Answer 3

尝试这个：

var values = [];

// get all spans with class 'checked'
$('div > span.checked').each(function() {

    // get the hidden field value
    values.push($(this).prev('[type="hidden"]').val();

    // remove the div containing this span
    $(this).parent().remove();

});

// get comma separated values
values = values.join(',');