JQuery/Javascript 我的功能在按下按钮时没有运行答案

【问题标题】：JQuery/Javascript my function is not running when pressing buttonJQuery/Javascript 我的功能在按下按钮时没有运行
【发布时间】：2019-08-17 10:01:38
【问题描述】：

我有一个按钮，当我单击时，我希望它从行中获取所有数据。我的 .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>

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

【问题讨论】：

.closest() 不是这样工作的。您可能想改用.siblings('rowdata')，或.prev() / .prevAll('.rowdata')，具体取决于。（另外，不相关：您的 <td> 未正确关闭。）
@Jeto 除了输入不能是tr的直接兄弟
@Taplar 好点，这是无效的 HTML，jQuery 在这种情况下甚至找不到它。

标签： javascript jquery function class rows

【解决方案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>

【讨论】：