单击具有相同 id 的多个元素时触发 js 函数

Question

我的 ASP 网格视图中有许多 link。每个 link 都应该在通过调用各自的 ID 单击它后触发 Javascript 函数。这是它的代码：

<script type="text/javascript">
  $(function () {
    $('#LkForgot').on('click', function (e) {
      alert("hi");
    });
  });
</script>

<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" DataKeyNames="ReportId"CssClass="GridViewStyle">
<asp:TemplateField>
  <ItemTemplate>
    <asp:ImageButton CssClass="Link" ID="IMGDetail" ClientIDMode="Static" runat="server" ImageUrl="~/Img/Detail.png" />
  </ItemTemplate>
</asp:TemplateField>

他们都有相同的ID，但只有第一个成功触发了函数。我希望每个 link 单独触发函数。

Answer 1

<script type="text/javascript">
$(function () {
    $('.Link').on('click', function (e) {
        alert("hi");
    });
});

Answer 2

我现在不知道 asp 但 ID 应该是唯一的。尝试动态填充 ID 或尝试使用类.

Answer 3

您正在使用 ID，它应该是唯一的，这就是为什么它只能在一个元素上工作，请尝试使用 class。您可以将相同的 class 应用于多个元素。

<script type="text/javascript">
$(function () {
    $('.LkForgot').on('click', function (e) {
        alert("hi");
    });
});

Answer 4

您必须识别元素中的唯一属性并将其用作唯一标识符。它并不总是必须是 'id' 标签。你也可以这样做

$("[ClientIDMode='Static']").bind("click", function(){console.log("clicked") })

单击具有相同 id 的多个元素时触发 js 函数

Fire a js function on click for multiple elements with the same id

html

javascript

gridview

onclick