Question

我有一个无序列表（ul），其列表项（li）元素每个包含一个包含2列的表（第一列是删除按钮（属性'data-id'包含数据的id），第二列是数据文本）。我需要获取每个li的表中的值，并将值添加到隐藏字段以便在服务器上进行处理。我如何从li里面的表中检索值。我知道如何遍历ul本身并拉出每个li ...

$('#ol li').each(function (i, li) {
    var listItem = li;
    // Get data from table within li here
});

但我不确定如何在这一步之后继续进行。谢谢你的帮助。

修改

以下是附加到ol的内容的示例。

$('#ol').append("<li><table><tbody><tr><td style='padding-right:16px'><button type='button' class='btn btn-danger remove' data-id='" + item.val() + "'><b>X</b></button></td><td>" + txt + "</td></tr></tbody></table></li>");

解

使用find（）我能够找到所需的元素并提取值。

$('#ol li').each(function () {

        var id = $(this).find('td').first().find('button').attr('data-id');

        if(id == -1)
        {
            var txt = $(this).find('td').last().text();

            $('#hf').val($('#hf').val() + txt + "|");
        }
        else
        {
            $('#hf').val($('#hf').val() + id + "|");
        }

    });

感谢那些协助的人。

Answer 1

您应该了解this关键字的使用情况。

所以，当你运行这样的函数时 -

$('#ol li').each(function(){
    $(this).val()  //returns the value of the current li that is being looped through
});

.each()函数的工作方式与循环相同，因此它一次遍历每个#ol li元素，并使用this访问当前元素正在循环中。

现在，从这里开始，您可以搜索所需的孩子。您很可能还必须使用jquery的.data()函数来获取存储在data-id属性中的信息。

https://api.jquery.com/jquery.each/

https://api.jquery.com/jquery.data/

Answer 2

你可以得到两列数据：

$('#ol li').each(function (i, li) {
    var listItem = li;
    var column1 = $(li).find("td").first().text();
    var column2 = $(li).find("td").last().text();
    // do things with columns
});

我假设您只有一张2x1表格，每张表格都有一个简单的文字值。

jQuery - 使用包含li的表循环ol，并从表列中获取数据

2 个答案: