Jquery点击功能不适用于所有ID

Posted 2023-05-08

【中文标题】Jquery点击功能不适用于所有ID

【英文标题】：Jquery click function not working for all the ids

【发布时间】：2020-03-20 02:31:22

【问题描述】：

我创建了一个包含数据库中所有产品的页面，这是一个动态页面。列是循环创建的。每当用户单击产品时，我都会获取唯一的产品 ID，但这仅适用于一个产品，即使未触发单击功能，也适用于下一个产品。下面是代码供参考。

专辑.产品名称 类别：专辑.product_category 价格：专辑.product_price

$(document).ready(function() $('#k').click(function() var a = $('#custId').val(); 警报（一） 控制台日志（一） );

这仅适用于第一个产品，即循环中的第一个产品。休息时，点击功能不起作用。请帮忙！

以下是 html 代码：

<div class="card-body"> 
    <a href="#" id="k">
        <img src="qph.fs.quoracdn.net/…" class="card-img-top"    id="k">
    </a> 
    <h5 class="card-title"> album.product_name </h5>
    <p class="card-text">Category :  album.product_category </p>
    <p class="card-text">Price :  album.product_price </p>
    <input type="hidden" id="custId" value= album.id > 
</div>

【问题讨论】：

下面是html代码 qph.fs.quoracdn.net/…" class="card- img-top" id="k">

【参考方案1】：

您不能有多个具有相同 ID 的元素。考虑为所有目标元素添加一个通用类名，例如myClass，然后您可以使用以下方法绑定所需的事件：

$('.myClass').click(function() 
    //your code here...
);

解释：浏览器假定您只有一个 id 为 k 的元素（因为按照惯例应该是这样），因此 $("#k") 将只针对具有该 ID 的第一个元素。

【讨论】：

我现在注意到的一件事是第一个对象的 id 只在我点击的地方返回。