使用 jquery 查找最近的 id

Posted 2023-05-08

【中文标题】使用 jquery 查找最近的 id

【英文标题】：Find closest id using jquery

【发布时间】：2022-01-14 12:22:16

【问题描述】：

我试图在单击按钮以将其发送到 ajax 请求时获取最接近的 id。但我一直在努力实现这一目标。

html部分就是这个（cshtml）

                            <div id="[e-mail]" class="modifyCar">
                                <!--Delete car button-->
                                <div>
                                    <button type="button" class="btn btn-secondary btn-sm bg-danger" id="btnDeleteCar" name="btnDeleteCar">
                                        <i class="fas fa-trash-alt"></i>
                                    </button>
                                </div>
                            </div>

我正在尝试提取 @car.Id 部分

JS部分是这样的：

id: $(this).closest("div").find(".modifyCar").attr("id"),

【问题讨论】：

ids 必须是唯一的。你不需要找到最接近的——应该只有一个与id。

您的意思是.closest(".modifyCar")？此外，不鼓励使用 ID 存储数据。 ID 确实应该用于固定的、静态的、唯一的元素。对于任意数据，请改用自定义 data- * attributes。例如。使用属性data-modify-car-id="@car.Id"。然后$(this).closest("[data-modify-car-id]").data("modifyCarId").

@ScottMarcus ids 是在 foreachloop 中生成的，它不只是一个，我试图在我按下按钮的行中找到正确的一个

然后，您应该寻找最接近的div，正如@SebastianSimon 所写的，其类为modifyCar。

the ids are generated in a foreachloop 这是代码的味道。 im trying to find the correct one in the row where i pressed the button 在这种情况下将 .find('div').find('.modifyCar') 更改为 .closest('.modifyCar')

【参考方案1】：

考虑以下内容。

$(function() 
  $(".btn").click(function() 
    var myId = $(this).closest(".modifyCar").attr("id");
    console.log(myId);
  );
);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="[e-mail]" class="modifyCar">
  <!--Delete car button-->
  <div>
    <button type="button" class="btn btn-secondary btn-sm bg-danger" id="btnDeleteCar" name="btnDeleteCar"><i class="fas fa-trash-alt"></i></button>
  </div>
</div>

.closest() 可以接受选择器，例如类名。您的代码将停在父 DIV 元素处，因为它匹配最近的 "div" 选择器。