获取 event.target 的 parents 的属性

Question

我有以下 HTML 代码

<html>
    <head>
         <script src="jquery-1.11.3.min.js"></script>
    </head>
    <body>
        <form class="form" id="form1">
            First name:<br>
            <input type="text" name="firstname">
            <br>
            Last name:<br>
            <input type="text" name="lastname">
        </form>
    </body>
</html>

我希望能够获得单击元素的 parent 的属性列表。例如，如果我单击输入标签，应该返回 "class" 和 "id"，因为它们是 "form" 标签的属性。

到目前为止，我设法获得了被点击元素的属性：

$(event.target.attributes)

但是，当我尝试对 parent 元素执行相同操作时，没有返回任何内容。请问我的代码有问题吗？

$($(event.target).parents().eq(0).attributes)

Answer 1

如果您实际上在事件处理程序中，为什么不直接使用 this 引用元素？？

$(this).parent().attr("class");

这适用于直接 parent，但是如果您尝试通过直接 parent 称呼某人，您可以使用 $(this).parents : ,

$(this).parents("form").attr("class");

编辑：由于您正在尝试获取属性列表并查看特定属性是否存在，因此您可以使用

$(this).parents("form")[0].attributes

这将 return 你一个 NamedNodeMap..

Answer 2

以下代码将迭代父元素，即表单元素

$.each($(event.target).parent().attributes, function() {
    // this.attributes is not a plain object, but an array
    // of attribute nodes, which contain both the name and value
    if(this.specified) {
      console.log(this.name, this.value);
    }
  });

此外，根据其他成员的建议，您应该使用 $(this) 代替 $(event.target)

Answer 3

我使用

解决了这个问题

$(event.target).parents().eq(0).each(function() {
    $.each(this.attributes, function() {
        if(this.specified) {
            alert(this.name, this.value);
        }
    });
});

获取 event.target 的 parents 的属性

get attributes of event.target's parents

jquery

parent