按下按钮

Question

我有一个按钮，当我单击时希望它从行中获取所有数据。我的.php文件（我这里也没有包括php代码）看起来像这样（我整理了表格以进行stackoverflow）

<tr class='rowdata'>
     <td>Bob</thd>
</tr>

<input type='submit' class='getRow' value='ClickMe'>

<script>
    $(".getRow").click(function() {
       var rowOfData = $(this).closest(".rowdata");
       alert(rowOfData.text());
    });

</script>

现在，我单击并没有任何反应。有任何想法吗？的。前缀表示正在搜索类。

Answer 1

首先，您是否检查过开发人员的控制台（F12），看是否有任何错误。您确定已经引用了JQuery库。

接下来，即使引用了JQuery，.closest()也会搜索您调用它的元素的祖先元素。如果您的按钮不是您要查找的元素的后代，则不会找到它。

现在，假设.closest()确实找到了您的行，然后您要在整行中要求.text()。这可能是您想要的，但似乎您更可能希望逐个数据存储单元。

此外，您的按钮是一个submit按钮，用于提交表单数据，但是似乎您在这里没有做。如果是这种情况，请使用常规按钮。

而且，HTML无效，因为您的单元格的结束标记不正确。

因此，请纠正所有问题：

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table>
<tr class='rowdata'>
     <td>Bob</td>
     <td>Smith</td>
     <td><input type='button' class='getRow' value='ClickMe'></td>
</tr>
</table>

<script>
    $(".getRow").click(function() {
       var rowOfData = $(this).closest(".rowdata");
       alert(rowOfData.text()); // Gets all the text in the row
       alert($("td:first-child", rowOfData).text()); // Gets just first cell
    });
</script>