如何使用jquery隐藏父元素？

Question

假设有以下HTML：

<li class="fooli">
   <a class="foo" href="javascript:foo(this);">anchor</a>
</li>
<li class="fooli">
   <a class="foo" href="javascript:foo(this);">anchor</a>
</li>

以下是使用jQuery 1.3.2的JavaScript代码：

function foo(anchor) {
  alert($(anchor).attr('href'));
}

我的目标是能够隐藏被点击的li，但我不能为它们分配唯一的id。因此，我想通过位置来实现（即通过识别特定的锚点）类似于$(anchor).parent().hide()这样的方法。

然而，上面的警告返回“undefined”，所以我甚至不确定我是否拥有正确的jquery对象。

如何找出$(anchor)是什么对象？特别地，如何查看它具有哪些属性、哪个类、是什么HTML元素等？

- dfrankow

Answer 1

难道你不能这样做吗：

$(function() {
  $("a.foo").click(function() {
    $(this).parent().hide();
    return false;
  });
});

使用：

<li class="fooli"><a class="foo" href="#">anchor</a></li>
<li class="fooli"><a class="foo" href="#">anchor</a></li>

- cletus

Answer 2

在jQuery中，$(...)永远不是单个HTML元素，而是它们的列表。

您可以使用.get()将其转换为常规JavaScript列表，或者更好地使用.each()：

$(anchor).each(function() { alert(this) });

这将给你类似于[object HTMLAElement]的东西。您需要使用for/in来完全检查它，但.tagName和.innerHTML可能足以找出您所在的位置。

我也喜欢使用$(...).css('outline', '1px solid lime')来查找元素。它使它们很难被忽视，并且易于用Firebug精确定位。

补充说明：我绝对同意上面的答案，即要将JavaScript与HTML分开。不要内联JS。

- Eevee

---

感谢您回答我提出的问题。 - dfrankow