• 点击其它地方隐藏div/事件冒泡/sweet-alert阻止冒泡


    点击document时把div隐藏,但点击div时阻止点击事件冒泡到document,从而实现“点击文档其它地方隐藏div,点击div本身不隐藏”。
    js代码如下:
    $("#div").click(function(e){
    e.stopPropagation();
    });
    $(document).click(function(){
    $("#div").hide();
    });
    实现了点击其它地方隐藏div后遇到了另一个问题。我的div内部使用了bootstrap的tab组件,div的onclick事件阻止冒泡后,tab失效了。原因暂时不明确。
    这个时候尝试换一种事件,用mouseDown而不是onclick,实现效果“tab组件正常使用,点击其它地方隐藏div”。

    项目用到了sweet-alert组件,点击div内部某个地方,出现sweet-alert弹窗,这个弹窗也需要阻止冒泡,即点击弹窗不隐藏div。但sweet-alert源文件并没有设置是否冒泡的接口,也不知道弹窗在何时渲染完成好添加阻止冒泡的代码。查看源文件后发现在执行函数openModel时弹窗加载完成,分别在defaultParams和availableCustoms
    添加stop_propagation属性,默认值设置为false,即默认冒泡,在openModel函数添加参数stop_propagation,在openModel函数体添加判断,代码如下
    if(stop_propagation){
    $('.sweet-alert').mousedown(function(e){
    e.stopPropagation();
    });
    }
    在使用sweet-alert的时候,就可以随意设置冒泡与不冒泡了。实现了点击sweet-alert不隐藏div。

  • 相关阅读:
    工业和信息化部“十二五”规划教材:阵列信号处理及MATLAB实现
    PHP 7从零基础到项目实战
    HTML+CSS网页设计详解
    新编 中文版Maya入门与提高
    Lua游戏AI开发指南
    这么设计能热卖:融入运营思维的电商设计进阶宝典(套装上下册)
    WCF初探-1:认识WCF
    用微信二维码登录自己的网站
    01-C语言基本知识
    「OC」内存管理
  • 原文地址:https://www.cnblogs.com/yulian/p/5210375.html
Copyright © 2020-2023  润新知