Question

我有一张几行的桌子。我想访问具有与触发函数populateRow（）的锚在同一行中的值的单元格; （我希望我能以清晰的方式解释它）。知道怎么做吗？

<tr>
   <td>
         some value
   </td>
   <td>
       <a href="#myPopup" data-rel="popup" class="ui-btn ui-btn-inline ui-corner-all ui-icon-check ui-btn-icon-left" onclick="populateRow();">update</a>
   </td>
</tr>
<tr>
    <td>
          another value
    </td>
    <td>
        <a href="#myPopup" data-rel="popup" class="ui-btn ui-btn-inline ui-corner-all ui-icon-check ui-btn-icon-left" onclick="populateRow();">update</a>
   </td>
</tr>

Answer 1

populateRow()函数需要知道点击了哪个锚点，因此您需要将this传递给它，以便为其提供对所述锚点的引用：

onclick="populateRow(this);"

function populateRow(anchor) {
  var row = $(anchor).closest("tr");
  var firstCellValue = row.find("td").first().text();
}

...并从那里使用.closest()将DOM导航到包含tr元素。

或者，更好的是，将click事件处理程序与jQuery绑定，而不是将其内联到每一行：

$(document).ready(function() {
  $("#idOfYourTable").on("click", "a", function(e) {
    var row = $(this).closest("tr");
    var firstCellValue = row.find("td").first().text();
    console.log(firstCellValue);
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<table id="idOfYourTable">
  <tr>
    <td>Value 1</td>
    <td>
      <a href="#myPopup" data-rel="popup" class="ui-btn ui-btn-inline ui-corner-all ui-icon-check ui-btn-icon-left">update</a>
    </td>
  </tr>
  <tr>
    <td>Value 2</td>
    <td>
      <a href="#myPopup" data-rel="popup" class="ui-btn ui-btn-inline ui-corner-all ui-icon-check ui-btn-icon-left">update</a>
    </td>
  </tr>
</table>

（单击“运行...”按钮以查看其是否正常工作。）

Answer 2

我不知道populateRow()函数的含义是什么，但是如果您希望获得相同td的第一个tr的值，那么您可以尝试测试：

的onclick = “警报（$（本）.closest（ 'TR'）找到（ 'TD：第一'。）文本（））”

如果你想在populateRow()函数中传递它，你可以：

的onclick = “populateRow（$（这）.closest（ 'TR'）找到（ 'TD：第一'。）文本（））”

或...... 如果你传递元素然后在你的函数中处理它会更加整洁：

的onclick = “populateRow（这）”

function populateRow(elm) {
    var val = $(elm).closest('tr').find('td:first').text();
    alert(val);
}

希望这会有所帮助。祝你好运！

如何从单元格中的锚点访问表行对象？

2 个答案: