繁体   English   中英

jQuery方法调用过两次?

[英]jQuery method called twice?

因此,我的导航栏中有一个嵌套的引导程序下拉列表。 这是防止单击嵌套的下拉列表以执行其正常任务的下拉列表的代码。 这很好。

(function($) {
    $(document).ready(function() {

        $('ul.dropdown-menu [data-toggle=dropdown]').on('click', function(event) {
            event.preventDefault();
            event.stopPropagation();
            $(this).parent().siblings().removeClass('open');
            $(this).parent().toggleClass('open');
        });
    });
})(jQuery);

在此代码中,下拉菜单的<li> onclick执行某些操作。 当单击位于下拉列表的普通li上时,它可以正常工作,但是当位于嵌套下拉列表的li中时,该函数将被执行,但在结束时将再次执行该函数(onClick)。 顺便我发现,以避免其完整的执行Seconde系列是我在检查我的if语句if $(this) (点击的li )是null ,其中当它执行的第二次无处是。 这种方法虽然很粗略,但确实可行,但是没有人知道为什么第二次调用该方法以及如何防止再次调用该方法吗?

$("#dropdownViewModeSelect").on('click', 'li', function() {

    selectedViewMode = $(this).attr("viewmode");

    if (selectedViewMode != "undefined" && selectedViewMode != null) 
    {
        if (selectedViewMode != previouslySelectedViewMode || currentTimelineMode != previouslySelectedTimelineMode) 
        {
            //Remove glyphicons to all i
            var touslesideslis = $("#dropdownViewModeSelect li").find("i").removeClass('glyphicon glyphicon-ok');
            //Add glyphicons to clicked i
            $(this).find("i").addClass('glyphicon glyphicon-ok');
            //Add text to button
            currentViewModeSecondary = $(this).attr("viewmodesecondary");
            var textBtn;
            if (currentViewModeSecondary != "classic")
                textBtn = "Ligne du temps - " + $(this).text();
            else
                textBtn = $(this).text();

            $("#dropdownMenuViewMode").text(textBtn);
            $("#dropdownMenuViewMode").append('<span class="glyphicon glyphicon-eye-open pull-left"></span>');
            $("#dropdownMenuViewMode").append('<span class="caret caret-filter"></span>');
            if ($(window).width() >= 768)
                Global.Responsiveness();
        }
    }

});

这是下拉菜单的HTML。

<li class="dropdown"> <a class="dropdown-toggle" id="dropdownMenuViewMode" data-toggle="dropdown" role="button" aria-expanded="false"><span class="glyphicon glyphicon-eye-open pull-left"></span>Jour<span class="caret"></span></a>

<ul class="dropdown-menu" id="dropdownViewModeSelect" role="menu">
    <li viewmode="jour" viewmodesecondary="classic"><a id="linkJour">Jour<i class='dropdownFiltreImage glyphicon glyphicon-ok'></i></a>
    </li>
    <li viewmode="ressource" viewmodesecondary="classic"><a id="linkRessource">Ressources/Jour<i class='dropdownFiltreImage'></i></a>
    </li>
    <li viewmode="week" viewmodesecondary="classic"><a id="linkSemaine">Semaine<i class='dropdownFiltreImage'></i></a>
    </li>
    <li viewmode="month" viewmodesecondary="classic"><a id="linkMois">Mois<i class='dropdownFiltreImage'></i></a>
    </li>
    <li viewmode="year" viewmodesecondary="classic"><a id="linkAnnee">Année<i class='dropdownFiltreImage'></i></a>
    </li>
    <li viewmode="agenda" viewmodesecondary="classic"><a id="linkAgenda">Agenda<i class='dropdownFiltreImage'></i></a>
    </li>
    <li class="dropdown dropdown-submenu"><a href="#" class="dropdown-toggle" data-toggle="dropdown">Ligne du temps</a>

        <ul class="dropdown-menu">
            <li viewmode="timeline" viewmodesecondary="timeline"><a id="linkTimelineDay">Jour<i class='dropdownFiltreImage'></i></a>
            </li>
            <li viewmode="timeline" viewmodesecondary="timeline"><a id="linkTimelineWeek">Semaine<i class='dropdownFiltreImage'></i></a>
            </li>
            <li viewmode="timeline" viewmodesecondary="timeline"><a id="linkTimelineMonth">Mois<i class='dropdownFiltreImage'></i></a>
            </li>
        </ul>
    </li>
</ul>

如果您的点击处理程序被调用了两次,则可能被设置了两次。 尝试更改选择器。 这可能不是您想要的最终类结构,但是我敢打赌,如果您将相同的类添加到每个列表元素,然后在选择器中使用该类作为单击处理程序,您的问题就会消失。

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM