Question

我有一个像这样的HTML表。

<table class="gvi gvi-rentals" data-bind="css: { hide: empty }" id="tblRentals">
    <tbody data-bind="foreach: rentals">
                <tr>
                    <td>
                        <span class="chb">
                            <input type="checkbox" name="Checked" value="false" data-bind="attr: { 'id': 'check_' + $index() }" />
                        </span>
                    </td>
                    <td class="multi-data">
                        <div class="col-product-id" name="ProductId" data-bind="text: ProductId" hidden></div>
                        <div class="col-product-name" data-bind="text: ProductName"></div>
                        <div class="col-serial-no" name="SerialNo" data-bind="text: SerialNo"></div>
                    </td>
                </tr>
            </tbody>
</table>

我需要读取所有<div>的值并将它们的值放入数组中。所以我也写了一个jQuery函数。

$('#tblRentals tr').each(function () {
        var tds = $(this).find("#Checked").val();
        rentals.push({
            Checked: $('td input[name="Checked"]', this).val(),
            ProductId: $('td div[name="ProductId"]', this).val(),
            SerialNo: $('td div[name="SerialNo"]', this).val(),
        });
    });

它不起作用，我得到的都是未定义的。这里有什么错误？

Answer 1

我不知道淘汰赛js但是我试图纠正你的jquery代码。

的Javascript

$(document).ready(function() {
  var rentals = [];
  $('#tblRentals tbody tr').each(function() {
    var Checked = $(this).find("td:eq(0) span input[name=Checked]").is(":checked");
    var ProductId = $(this).find(".multi-data .col-product-id").text();
    var ProductName = $(this).find(".multi-data .col-product-name").text();
    var SerialNo = $(this).find(".multi-data .col-serial-no").text();
    rentals.push({
      "Checked": Checked,
      "ProductId": ProductId,
      "ProductName": ProductName,
      "SerialNo": SerialNo
    })

  });
  console.log(rentals);
});

HTML

<table class="gvi gvi-rentals" data-bind="css: { hide: empty }" id="tblRentals">
  <tbody data-bind="foreach: rentals">
    <tr>
      <td>
        <span class="chb">
                            <input type="checkbox" name="Checked" value="false" data-bind="attr: { 'id': 'check_' + $index() }" />
                        </span>
      </td>
      <td class="multi-data">
        <div class="col-product-id" name="ProductId" data-bind="text: ProductId" hidden></div>
        <div class="col-product-name" data-bind="text: ProductName"></div>
        <div class="col-serial-no" name="SerialNo" data-bind="text: SerialNo"></div>
      </td>
    </tr>
  </tbody>
</table>

希望它可能对你有帮助。

Answer 2

您当前的代码使用.val()来获取“值”。

$('#tblRentals tr').each(function () {
    var tds = $(this).find("#Checked").val();
    rentals.push({
        Checked: $('td input[name="Checked"]', this).val(),
        ProductId: $('td div[name="ProductId"]', this).val(),
        SerialNo: $('td div[name="SerialNo"]', this).val(),
    });
});

这仅用于输入（文本/选择），对于div，使用.text()和复选框使用.is(":checked")。

$('#tblRentals tr').each(function () {
    var tds = $(this).find("#Checked").val();
    rentals.push({
        Checked: $('td input[name="Checked"]', this).is(":checked"),
        ProductId: $('td div[name="ProductId"]', this).text(),
        SerialNo: $('td div[name="SerialNo"]', this).text(),
    });
});

如果您需要格式化，也可以将.html()用于div。

在使用jQuery中读取<div>

2 个答案: