单击嵌套元素时防止切换

Question

我开发了这个菜单，带有 li 元素的子 ul 通过切换（）单击父 li 滑入和滑出。如果显示另一个子 ul，脚本将其关闭。这对于标准链接来说效果很好，但我想用 ajax 请求替换链接点击，如果页面没有改变，点击嵌套的 li 链接，会使相对的子菜单关闭。

我想防止单击链接时关闭子菜单。我尝试将点击功能从 LI 移至 SPAN，但没有找到正确的方法。

JavaScript：

(function($){
$.fn.extend( {
    verticalfade: function(options){

        var defaults = {
            speed: 'normal'
        };
        var options = $.extend(defaults, options);

        $(this).addClass('verticalFadeMenu');

        //close all sub menu                
        $('ul#verticalfade li ul').each(function(){
            $('ul#verticalfade li ul').hide();
        });    

        //toggle sub menu
        $('ul#verticalfade li').live('click',function(){
            var t = this;

            $('ul#verticalfade li').each(function(){
                if (this != t)
                {
                    if($(this).children('ul').is(":visible"))
                    {
                        $(this).children('ul').toggle(800);
                    }
                }
                else
                {
                    $(this).children('ul').toggle(800);
                }
            });
        })

        //manage links
        $("ul#verticalfade li ul li a").click(function(e){  
            //prevent default action  
            e.preventDefault();  
        });
    }    
});})(jQuery);

HTML：

<div id="verticalfade_container">
    <ul id="verticalfade">
        <li><span>First</span>
            <ul>
                <li><a href="test1.html">Link 1</a></li>
                <li><a href="test2.html">Link 2</a></li>
            </ul>
        </li>
        <li><span>Second</span>
            <ul>
                <li><a href="test1.html">Link 1</a></li>
                <li><a href="test2.html">Link 2</a></li>
            </ul>
         </li>
    </ul>
</div>

Answer 1

我认为停止事件冒泡可能会对您有所帮助。尝试看看下面是否有效

    $("ul#verticalfade li ul li a").click(function(e){  
        e.stopPropagation();  
    });

或

    $("ul#verticalfade li ul li a").click(function(e){  
        return false; // should cancel default action as well as event bubbling.
    });