Question

所以我有以下代码：

请查看JSFiddle：https://jsfiddle.net/gL2emr8h/3/

我想获取所选行ID的值。我不知道用哪个函数从所选行中获取第一个单元格的值。目前，它还未定义。

  <table class="table table-striped" style="min-width: 100%;">
    <tr>
      <th>Id</th>
      <th>Name</th>
      <th>Type</th>
    </tr>
      <tr>
        <td>1</td>
        <td>Name1</td>
        <td>Type1</td>
      </tr>
      <tr>
        <td>2</td>
        <td>Name2</td>
        <td>Type2</td>
      </tr>
    </table>

CSS：

tr {
  background: #00eeff;
}

.active {
  background: #ff5500;
}

JavaScript的：

 var selectedHazardId;

  $(function() {

    /* Get all rows from your 'table' but not the first one 
     * that includes headers. */
    var rows = $('tr').not(':first');

    /* Create 'click' event handler for rows */
    rows.on('click', function(e) {

        /* Get current row */
        var row = $(this);
        rows.removeClass('active');
        row.addClass('active');

        selectedHazardId = row.children('td')[0].html();
        console.log(selectedHazardId);
    });
});

Answer 1

请将selectedHazardId = row.children('td')[0].html()更改为$(row.children('td')[0]).html()或selectedHazardId = $(row.find('td')[0]).html()

Answer 2

通过索引（例如$("*")[0]）从JQuery数组中提取项目将为您提供一个没有$.html()函数的DOM对象。要使用此方法，您需要访问textContent属性：

selectedHazardId = row.children('td')[0].innerHTML;

要将项目从jQuery数组中拉出来，同时保持它是JQuery对象，您需要使用$.eq()。

selectedHazardId = row.children('td').eq(0).html();

或者，:eq()可用作选择器：

selectedHazardId = row.children('td:eq(0)').html();

Answer 3

问题是row.children('td')[0]是一个普通的DOM项，但是.html是一个jQuery函数。

因此，如果将DOM项目包装在jQuery函数中，则可以使用jQuery＆＃39; .html，或者可以使用DOM项目所具有的本机属性之一。

jQuery方式：

var idRow = row.children('td')[0];
selectedHazardId = $(idRow).html();

原生方式：

var idRow = row.children('td')[0];
selectedHazardId = idRow.innerText // or innerHTML or TextContent

如何获取表格单元格中的值？

3 个答案:

jQuery方式：

原生方式：