javascript - jQuery为多个输入添加点击功能

Question

这个问题已经有答案了:

Does the id attribute of an HTML element have to be unique in the whole page? (14 个回答)

已关闭 4 年前。

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

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

Answer 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>