Question

我的表数据如下所示，数据属性在每一行中具有不同的值。我想使用jQuery收集这些值。我在jQuery中编写了逻辑，但循环对我来说不起作用。

  <table id="tblAdAttribute">

  <thead>

    <tr> </tr>

  </thead>
  <tbody>
    @if (Model != null)
    {
         foreach (var item in Model)
            {
                <tr>
                   <td>@Html.DisplayFor(modelItem => item.Title)</td>
                   <td>
                       <a href="#"><input type="checkbox" 
                   name="chkSelected" 
                   data-values="'@item.Title', @((int)item.DataType))"></a>
                  </td>
                </tr>
               }
       }
    </tbody>
  </table>

这是我从HTML中提取“数据值”的循环逻辑。

    var getSelectedAttributes = function () {

    var values = new Array();
    var singlevalue;
    debugger;
    $.each($("input[name='chkSelected']:checked").closest("td").siblings("td"),
           function () {
               singlevalue = $(("input[name='chkSelected']:checked")).attr("data-values");
               values.push(singlevalue);
               alert(singlevalue);  // Here i always get same value :(
           });

    SelectedAttributes =  values.join(", ");
};

当我发出警报时，它总是给出第一行值而不是循环其余值。

Answer 1

您总是得到相同的值，因为您在循环的每次迭代中选择相同的东西。您不需要使用closest或siblings来遍历DOM，因为您想要的data属性直接位于复选框本身上。试试这个：

var getSelectedAttributes = function() {
    var values = $("input[name='chkSelected']:checked").map(function() {
        return $(this).data('values');
    }).get();
    alert(values);

    // do something with the values array here...
}

这里我使用map()来创建数据属性数组。

Answer 2

为什么不使用：

$("input[name='chkSelected']:checked").each(function () {
    singlevalue = $(this).data("values");
    values.push(singlevalue);
    alert(singlevalue);
}).promise().done(function(){
    SelectedAttributes =  values.join(", ");
});

循环对我使用jQuery不起作用

2 个答案: