弹框点击弹框以外的地方弹框隐藏

最新推荐文章于 2025-06-09 20:08:01 发布

栗子i维C

最新推荐文章于 2025-06-09 20:08:01 发布

阅读量721

点赞数

CC 4.0 BY-SA版权

分类专栏： JavaScript 文章标签：弹框

本文链接：https://blog.youkuaiyun.com/Alisa_vc/article/details/88995780

JavaScript 专栏收录该内容

19 篇文章

订阅专栏

本文介绍了一个使用jQuery实现的点击事件案例，通过点击导航项显示和隐藏屏幕弹层，并利用stopPropagation防止事件冒泡，确保弹层之外区域点击不会触发弹层关闭。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

$(function(){
  $('.screen-nav li').on('click',function(e){
    $('.screen-box').show();
    $(document).one('click',function(){
        $('.screen-box').hide();
    })
    e.stopPropagation();/*stopPropagation();方法可以阻止把事件分派到其他节点*/
    $(".screen-box").on("click", function(e){
        e.stopPropagation();
    });
  })    
})