javascript 的事件--阻止冒泡
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>测试</title>
</head>
<body>
<input type="button" id="btn1" value="点击">
<div id="div1" style="width: 200px; height: 200px; display: none;"></div>
<script>
window.onload=function(){
var oBtn=document.getElementById('btn1');
var oDiv=document.getElementById('div1');
oBtn.onclick=function(eve){
var oEvent=eve||event; //处理ie和火狐的兼容性问题
oDiv.style.display='block';
alert('按钮点击了');
oEvent.cancelBubble=true; //阻止冒泡
}
document.onclick=function(){
alert('冒泡');
}
}
</script>
</body>
</html>
javascript 的事件--阻止冒泡的更多相关文章
- 重新认识vue之事件阻止冒泡
冒泡的表现 近期用vue做了一个需求,大概是同一个区域,点击不同位置有不同的响应函数,还有个总的响应函数,好吧,如下图所示: 他们的DOM结构如下: <div v-for="(item ...
- JS事件阻止冒泡的写法
$("body").on("click", "#id", function (ev) { ev = ev || event;要写的逻辑代码 ...
- html如何点击子元素事件而不触发父元素的点击事件——阻止冒泡
如果子元素和父元素都有点击事件,会出现点击事件冒泡的情况. 1.如何避免冒泡: html: <html> <head></head> <body> &l ...
- angular 点击事件阻止冒泡及默认行为
经常遇到场景:多层级元素绑定ng-click 事件,则底层元素的点击事件存在冒泡现象,怎么解决? 类似原生JS ,只是语法稍有不同,如下: 阻止冒泡 $event.stopPropagation() ...
- vue.js 自带阻止默认事件 阻止冒泡
<!-- 阻止单击事件冒泡 --> <a v-on:click.stop="doThis"></a> <!-- 提交事件不再重载页面 ...
- vue 点击事件阻止冒泡 用stop
1.使用vue阻止子级元素的click事件冒泡,很简单,用stop.eg: @click.stop='xxx'
- js 事件阻止冒泡
参考 https://www.cnblogs.com/zhuzhenwei918/p/6139880.html event.stopPropagation();
- 点击其它地方隐藏div/事件冒泡/sweet-alert阻止冒泡
点击document时把div隐藏,但点击div时阻止点击事件冒泡到document,从而实现“点击文档其它地方隐藏div,点击div本身不隐藏”.js代码如下:$("#div") ...
- label 阻止冒泡 防止点击label 触发2次事件
// 必须要把 jnput的外面的label加上事件阻止冒泡,否则点击label的时候,会冒泡到input上 再次触发input的点击事件 $('.xt_order_cleft_modb_rl_dx' ...
随机推荐
- 你所不了解的setTimeout
看到了一篇不错的文章<你会用setTimeout吗 >,转载过来的,改了个名字,一下子感觉搞大上了,嘎嘎. 加了几个关于 setTimeout 和setInterval的小知识: 关于se ...
- spring mvc 4数据校验 validator
注解式控制器的数据验证.类型转换及格式化——跟着开涛学SpringMVC http://jinnianshilongnian.iteye.com/blog/1733708Spring4新特性——集成B ...
- 【MySQL】优化—工欲善其事,必先利其器之EXPLAIN
接触MySQL已经有一段时间了,了解如何优化它也迫在眉睫了,话说工欲善其事,必先利其器.最近我就打算了解下几个优化MySQL中经常用到的工具.今天就简单介绍下EXPLAIN. 环境准备 Explain ...
- [zz] Pixar’s OpenSubdiv V2: A detailed look
http://www.fxguide.com/featured/pixars-opensubdiv-v2-a-detailed-look/ Pixar’s OpenSubdiv V2: A detai ...
- hpp头文件与h头文件的区别
hpp,其实质就是将.cpp的实现代码混入.h头文件当中,定义与实现都包含在同一文件,则该类的调用者只需要include该hpp文件即可,无需再将cpp加入到project中进行编译.而实现代码将直接 ...
- [踏得网]HTML5在线教程阅读进度记录
2017年1月3日18:12:19http://techbrood.com/h5b2a?p=html-canvas-states 2017年1月3日17:10:11http://techbrood.c ...
- 一、Owin Identity的使用
参照http://www.cnblogs.com/r01cn/p/5177708.html教程. 注意点: 1.Nuget包分别下载Microsoft.AspNet.Identity(Owin必须), ...
- AX 2012 SSRS print setting-报表打印输出设置
static void callerreport_printsetting(Args _args) { LedgerJournalController controller = new LedgerJ ...
- JAVA设计模式之解释器模式
在阎宏博士的<JAVA与模式>一书中开头是这样描述解释器(Interpreter)模式的: 解释器模式是类的行为模式.给定一个语言之后,解释器模式可以定义出其文法的一种表示,并同时提供一个 ...
- Vs打包工程 错误: Unable to update the dependencies of the project (转)
Setup Project 错误: Unable to update the dependencies of the project 在VS2010中编译包含安装工程的解决方案提示错误:Unable ...