jQuery向多个输入添加点击功能[重复]

Posted 2023-05-09

【中文标题】jQuery向多个输入添加点击功能[重复]

【英文标题】：jQuery add click function to multiple input [duplicate]

【发布时间】：2019-08-05 15:58:03

【问题描述】：

我想要一个函数来响应对输入字段的每个实例的点击。但该函数只响应点击输入的第一个实例。

html 是：

<table class="table">
  <tr>
     <td><input id="show-output" type="button" value=261 /></td>
     <td>mhour test202</td>
  </tr>
  <tr>
     <td><input id="show-output" type="button" value=260 /></td>
     <td>mhour test145</td>
  </tr>
</table>

功能是

$('#show-output').click(function(e) 
  alert("hi");
);

A fiddle for this

【问题讨论】：

使用类对元素进行分组。 id 只能引用唯一元素

您应该每页只使用一次 id。在这里使用一个类，它会工作

解决方法***.com/a/6850569/2804966

@lalo 这是一个你永远不应该使用的解决方法。您应该解决问题的根源，而不是绕过它。

谢谢大家，解决了！

【参考方案1】：

将您的 id 更改为类，因为 id 应始终在页面上只出现一次。

$('.show-output').click(function(e) 
  alert("hi");
);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<table class="table">
  <tr>
     <td><input class="show-output" type="button" value=261 /></td>
     <td>mhour test202</td>
  </tr>
  <tr>
     <td><input class="show-output" type="button" value=260 /></td>
     <td>mhour test145</td>
  </tr>
</table>