1

我有一个要禁用的链接。问题是它位于具有子列表的 li 中，因此它也会禁用这些链接。HTML 看起来基本上是这样的：

<div id="main">
<ul class="index"><li class="firstLI"><a href="some other URL"></a></li>

<li class="secondLI"><a href="disableMe">Disable this Link</a>
   <ul>
        <li><a href="dontDisableMe">Don't Disable Me</a></li>
        <li><a href="dontDisableMe">Don't Disable Me</a></li>
   </ul>
</li>
<li>third</li></ul>
</div>

我想禁用“li”类 secondLI 中的“a”，但不是所有伴随的 UL 的孩子。

我试过了：

function preventDefault(e) {
        e.preventDefault()};

    $("#main li:nth-child(2) a").bind("click", preventDefault);

    $(".secondLI").unbind("click", prevenDefault);

和

$("#main li:nth-child(2) a").click(function(e) {
    e.preventDefault();
    //do other stuff when a click happens
});
4

2 回答 2

4

使用仅选择直接子级的>选择器。

$("#main li:nth-child(4) > a").click(function(e) { ...

或者，如果只有一个链接，请使用:first选择器。

$("#main li:nth-child(4) a:first").click(function(e) { ...

或者更好的是，如果可以的话，给链接一个类或一个 ID，然后直接选择它。

于 2012-04-14T07:49:43.417 回答
0

单击事件气泡：首先触发 li 元素的单击处理程序（如果有），然后是父级的单击处理程序，然后是父级的父级的单击处理程序，依此类推。此链中的任何处理程序都可以取消默认操作。因此，如果您在li liwithout中有一个事件处理程序preventDefault（或根本没有事件处理程序），并且在父级上有一个事件处理程序liwith preventDefault，那么默认操作将被阻止。

解决这个问题的两种简单方法：

  • 在外部的事件处理程序中li，检查 click() 的目标，如果它不在子级内部，则e.target仅调用；preventDefaultul
  • 在 inner 的事件处理程序中li，取消冒泡（e.stopPropagation）；这样，li根本不会调用父级的事件处理程序。
于 2012-04-14T08:14:29.940 回答