Question

我有一个包含此HTML的下拉菜单：

<ul id="dropdownmenu" class="dropdown maintopmenu">

<li class="topmenu" link="link0.htm">SELL
    <ul>
        <li link="link1.htm"><span class="menulink">APPLY TO SELL</span>/li>
        <li link="link2.htm"><span class="menulink">FEE/FEATURES</span></li>
        <li link="link3"><span class="menulink">FAQ</span></li>
        <li link="mycart.php?4"><span class="menulink">IMAGE GUIDELINE</span></li>
    </ul>
</li>
</ul>

然后我有这个jquery函数应该转到页面链接=点击的任何内容。这是做什么，总是去第一个li链接（主要的父母）。我的猜测是忽略了那个里面的整个区块。

$(function() {
    $('li[link]').click(function() {
    document.location.href=($(this).attr('link'));
});
});

我需要这个以适应所有级别的子菜单。

Answer 1

可能是因为事件正在冒泡到祖先<li>并触发其处理程序。

您需要使用event.stopPropagation()^(docs)方法或return false;停止传播事件。

$('li[link]').click(function( event ) {
    document.location.href = ($(this).attr('link'));
    event.stopPropagation();
});

Answer 2

$(function() {
          $('li').click(function(e) {
          var $var = $(this).attr("link");
              alert($var);
              e.stopPropagation();
          //document.location.href=($(this).attr('link'));
         } );
    });

使用e.stopPropagation（）;

希望这会有所帮助

Answer 3

我建议不要为你的html使用奇怪的，无效的属性，如果这是不可避免的，请使用jQuery创建传统的标记，例如：

$('li').each(
    function(){
        var linkTo = $(this).attr('link');
        $(this).find('span').wrap('<a href="' + linkTo + '"></a>');
    });

JS Fiddle demo

但我强烈建议使用a元素而不是JavaScript malarkey，尤其是因为JS / jQuery在没有JS的情况下不会降级。

Answer 4

简单，在func结束时返回false。

$(function() {
    $('li[link]').click(function() {
        document.location.href=($(this).attr('link'));
        return false;
    });
});

它完美无缺！

使用jquery链接<li>未正常工作的孩子</li>

4 个答案: