JQuery 取消时间冒泡

最新推荐文章于 2019-07-25 03:42:07 发布

子晴呀

最新推荐文章于 2019-07-25 03:42:07 发布

阅读量442

点赞数

本文链接：https://blog.csdn.net/qq_36074064/article/details/70495909

版权

我们想要实现的效果是：1.鼠标点击大的方框内容时弹出警告窗口（这是大的div）,不包括点击小的div内部部分

2.鼠标点击大的方框内容时弹出警告窗口（这是小的div）,但是不弹出警告（这是大的div），

以下是实现效果

[javascript] view plain copy print?在CODE上查看代码片派生到我的代码片
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>  
<%  
String path = request.getContextPath();  
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";  
%>  
  
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">  
<html>  
  <head>  
    <base href="<%=basePath%>">  
      
    <title>My JSP 'day03.jsp' starting page</title>  
         <script type="text/javascript" src="js/jquery-1.11.1.js"></script>  
    <meta http-equiv="pragma" content="no-cache">  
    <meta http-equiv="cache-control" content="no-cache">  
    <meta http-equiv="expires" content="0">      
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">  
    <meta http-equiv="description" content="This is my page">  
    <!-- 这是给div 设置的表框的一些属性 -->  
    <style type="text/css">  
     
        #bigdiv {  
            width: 300px;  
            height: 300px;  
            border: 1px solid red;  
        }  
        #smalldiv {  
            width: 100px;  
            height: 100px;  
            border: 1px solid red;  
        }  
      </style>  
  
  
<script type="text/javascript">  
$(function(){  
//给大div注册事件  
$("#bigdiv").click(function(){  
alert('big div');  
});  
//给小的div注册事件  
$("#smalldiv").click(function(event){  
alert('小的  div');  
  
//取消事件冒泡  
//第一道能力检测:分浏览器  
  
//UI工程师  能力检测  
//判定浏览器引擎是IE还是其他浏览器(第一道能力检测)  
event=event||window.event;  
    //第二道能力检测     
if(event.stopPropagation){//非IE浏览器  chrome  IE6以上就差不多都可以了   
event.stopPropagation();  
}else{  
    //IE浏览器  
event.cancelBubble=true;  
    }  
          });  
  });  
  
  
  
</script>  
  </head>  
    
  <body>  
 <div id="bigdiv">我是大的div  
 <div id="smalldiv">我是小的div</div>  
 </div>  
  </body>  
</html>

子晴呀

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JQuery 取消时间冒泡

我们想要实现的效果是：1.鼠标点击大的方框内容时弹出警告窗口（这是大的div）,不包括点击小的div内部部分 2.鼠标点击大的方框内容时弹出警告窗口（这是小的div）,但是不弹出警告（这是大的div），以下是实现效果[javascript] view plain copy
复制链接

扫一扫