分类导航

jQuery 发布时间：2022-03-30 发布网站：大佬教程 code.js-code.com

大佬教程收集整理的这篇文章主要介绍了jquery – 在click事件中使用stopPropagation，大佬教程大佬觉得挺不错的，现在分享给大家，也给大家做个参考。

我在div中有一个带有“元素”类的锚.

<div class="element logout">
    <div class="subTop">
        <a href="home.jsp" onclick="return confirm('Do you want to logout?');">Log Out</a>
    </div>
</div>

我使用以下代码来处理注销.

jQuery(".element").click(function(E){
    var tmpHref=jQuery(this).not('.logout').find(".subTop>a").attr('href');
    if(tmpHref!=undefined&&tmpHref!=""&&tmpHref!=null)
    {
        window.LOCATIOn.href=tmpHref;
    }
    else
    {
        jQuery(this).find(".subTop>a").click();
    }
});

但我的问题是确认事件一次又一次地触发.我认为这是因为传播均匀.经过我的研究,我发现我可以使用07. post后的e.stopPropagation().但我无法弄清楚如何在这里使用它.

编辑
消息“您要退出吗？”在确认框中是从数据库中动态获取的,所以我无法在代码中对其进行硬编码.

解决方法

这是基于我认为你想要的一些假设.从评论和问题我明白,如果外部div doe snot具有logout类,则应该将用户发送到’home.jsp’,如果是,则发送到’logout.jsp’.如果这是正确的,你可以将html改为

<div class="element logout">
  <div class="subTop">
    <a href="home.jsp" data-confirmmsg="Do you want to logout?" >Log Out</a>
  </div>
</div>

和JavaScript到

jQuery(".subTop>a").click(function(E){
  e.preventDefault();
});
jQuery(".element").click(function(E){
    var self = jQuery(this),islogout = self.hasClass('logout')
        anchor = self.find(".subTop>a")
        href = islogout ? "logout.jsp" : anchor.attr('href');

    if(!islogout || (islogout && confirm(anchor.data('confirmmsg'))))
    {
        window.LOCATIOn.href=href;
    }
});

Javascript的第一部分只是禁用a-tag作为链接.除了将事件传播到外部元素之外没有任何事情发生(如果点击实际上在链接上,我们仍然要让`div-tag处理它). JavaScript的第二部分首先检查注销类是否存在,然后相应地设置href.最后,如果用户被发送到’logout.jsp’,将显示确认框并测试返回值.