Javascript 在单击按钮的父元素中获取值

我是Jquery新手，正在尝试访问单击按钮的父级。这是因为我正在动态生成div，所以我希望相应的按钮单击应用于正确的div

访问单击按钮的父级后，我想访问其中的几个输入值。
控制台中出现错误：

[DOM]发现2个元素具有非唯一id#quantity

，因为我有一个for循环，该循环生成具有唯一数量的类似div

我尝试过使用

document.getElementById（“onekg”）.value但它仅适用于第一个元素，而不适用于后续元素

    <% cakes.forEach(cake => { %>
        <div class="item-cart">
         <input type="hidden" name="onekg" id="onekg" value="1000">
         <input id="quantity" type="text" name="quantity" value="1">
         <button id="plus_btn" class="plus-btn qbtn" type="button" name="button">+</button>
       </div>
    <% }) %>


我不知道我是否认为这一切都错了，但我已经尝试了几种解决方案，但都没有成功。
您可以使用以下代码

$(".plus-btn").click(function (event) {
    var parent = $(this).closest('.item-cart');
});

上面的代码将找到作为单击按钮父级的item cart类。因此，每次单击按钮时，您都可以访问该特定单击按钮的父级

因此，根据您的代码，您的代码如下所示

$(".plus-btn").click(function (event) {
    var parent = $(this).closest('.item-cart');
    var onekg = parent.find("#onekg").val();
    var quantity = parent.find("#quantity").val();
});

但您应该知道，任何Id在一个页面中不应超过一次。因此，我建议您将onekg和quantity更改为class，并重写代码，如下所示

<input type="hidden" name="onekg" class="onekg" value="1000">
<input class="quantity" type="text" name="quantity" value="1">

id
s在文档中必须是唯一的，您必须为元素指定一个唯一的id，或者使用一个类。如何访问其中的元素？非常感谢！救了我很多钱headache@TimMwaura很乐意提供帮助：）将输入字段的ID更改为class，否则以后您将不得不处理更多问题，包括HTMLvalidation@meleyal那是不对的。请阅读文件。它检查自己和祖先的身份。正如梅尔文指出的那样。因为这是一个非常好的方法，它甚至是在JS中以
元素.closest（）
@melvin（）本机引入的。是的，在阅读了文档之后，结果证明你是对的！但是，在这种情况下，
parent（）
只需要检查单个元素，而
closest（）
将同时检查元素本身和父元素。
<input type="hidden" name="onekg" class="onekg" value="1000">
<input class="quantity" type="text" name="quantity" value="1">

$(".plus-btn").click(function (event) {
    var parent = $(this).closest('.item-cart');
    var onekg = parent.find(".onekg").val();
    var quantity = parent.find(".quantity").val();
});