Question

我尝试了几种方法，但是无法完成它。

我正在设计ul / li的菜单。我希望如果<li>具有href属性，jQuery会为其创建一个事件，以便重定向到属性存储的站点。但是当没有href时，没有任何反应。问题是当我点击一些li时，同一分支中的那些也正在获取事件

$("#menu-h > li li").each(function() {

      if($(this).attr("href")) {
           $(this).click(function() {
                window.location = $(this).attr("href");
                return false;
           });
      }
});

似乎each()不会在#menu-h > li之后迭代所有'li'，而只会在直接后代（子）上迭代，所以当我在li里面点击更多时，如{{1} }，$（this）值存储其父元素的DOM元素。这是错误选择器的问题，还是我不能迭代所有后代，只有直接的后代？

Answer 1

无需遍历每个元素并添加点击事件处理程序，您可以使用选择器li查找具有href属性的所有li[href]。

$(function(){
    $("#menu-h li[href]").click(function() {
        if($(this).attr("href")) {
            window.location = $(this).attr("href");
            return false;
        }
    });
});

更好的解决方案是使用事件委派

$("#menu-h").on('click', 'li[href]', function() {
    if($(this).attr("href")) {
        window.location = $(this).attr("href");
        return false;
    }
});

jQuery .each不会迭代所有后代

1 个答案: