Question

我没有使用表，而是使用以下HTML显示col 1中的复选框，col 2中的名称和col 3中的EMail地址.HTML如下所示：

<div class="rowLight">
<div class="select"><input name="checkbox" id="chk1" class="chktbl" type="checkbox"></div>
<div class="name">Mary</div><div class="emayl">Mary@ABC.com</div>
</div>
<div class="rowDeep">
<div class="select"><input name="checkbox" id="chk2" class="chktbl" type="checkbox"></div>
<div class="name">Jerry</div><div class="emayl">Jerry@ABC.net</div>
</div>

我需要遍历每个复选框，然后选中该框，捕获名称＆amp;将发送到将填充EMail表的Web服务的电子邮件地址。我试过这样的事，但需要帮助...

var vals = [];
$('.select input[type="checkbox"]:checked').each(function(i) {
var name = $(this).next('.name');
vals.push(($(name).html());
var emayl = $(this).next('.emayl');
vals.push(($(emayl).html()); });

感谢名单，
杰里

Answer 1

这样的事情可行：

var data = $(".select input:checkbox:checked").map(function() {
    var $parent = $(this).closest(".select");
    return {
        name: $parent.next(".name").text(),
        email: $parent.siblings(".emayl").text()
    };
}).get();

请注意，数据如下所示：

[ { name: '<name>', email: '<email>' }, ... ]

示例： http://jsfiddle.net/andrewwhitaker/rMPDH/

如果你真的想要数据只是一个数组：

["<name1>", "<email1>", "<name2>", "<email2>"]

你可以尝试：

var data = $(".select input:checkbox:checked").map(function() {
    var $parent = $(this).closest(".select");

    return [ $parent.next(".name").text(), $parent.siblings(".emayl").text() ];
}).get();

示例： http://jsfiddle.net/andrewwhitaker/4GdC8/

备注：

使用方便的.map获取jQuery结果并将其转换为您需要的数据。

在.get()调用结束时调用.map会强制生成的对象进入正确的数组（而不是jQuery对象）

使用.closest()，.next()和.siblings()来检索正确的数据。

Answer 2

以下是另一种解决方案，使用rowDeep和rowLight来表示行

$('.rowLight,.rowDeep').each(function(i,e){
    var $row = $(e);

    // see if the checkbox is checked
    if ($row.find('input[type="checkbox"]').is(':checked')){
        var name = $row.find('.name').text(),
            emayl = $row.find('.emayl').text();

        alert(name + ' <' + emayl + '>');
    }
});

DEMO

Answer 3

检查这个小提琴，打开你的浏览器javascript控制台，即Chrome或firefox中的firebug。 http://jsfiddle.net/q2jsp/12/

取决于jquery的版本，您可以使用siblings（）或next（）。next（）。

选中复选框时，jQuery检索数据

3 个答案: