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

【问题标题】：Delete Div and get Hidden field value - best approach删除 Div 并获取隐藏字段值 - 最佳方法
【发布时间】：2013-05-16 08:09:46
【问题描述】：

我有以下 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 实现一些逻辑。

场景是如果 span 已检查类。我需要实现 2 件事

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

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

【问题讨论】：

也粘贴你的javascript代码。
您的 HTML 在所有跨度上都缺少结束跨度标记。

标签： jquery html

【解决方案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/

【讨论】：

我喜欢你的方法，但我可以问一下.get() 在做什么，为什么没有它就行不通？
来自api.jquery.com/get：获取jQuery对象匹配的DOM元素。它选择并返回 dom 元素
调用.get() 以从.map() 返回的jquery 对象中获取普通数组，并与.join(',') 加入该数组
@pXL，优雅、简洁的解决方案。 +1。

【解决方案2】：

DEMO

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

【讨论】：

【解决方案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(',');

【讨论】：