最新下载
热门教程
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
js中简单阻止事件冒泡的方法
时间：2014-08-14 编辑：简简单单 来源：一聚教程网
JavaScript 阻止事件冒泡，无使用其它插件来辅助，原生JS代码，考虑到浏览器的兼容性问题，这里对IE/火狐、Operating以及Chrome都有针对性的判断，代码如下：
| 代码如下 | 复制代码 |
|
function cancelBubble(evt) { |
|
停止事件传播
事件对象还提供了一个.stopPropagation()方法，该方法可以完全阻止事件冒泡。与.target类似，这个方法也是一种纯JavaScript特性，但在跨浏览器的环境中则无法安全地使用 。不过，只要我们通过jQuery来注册所有的事件处理程序，就可以放心地使用这个方法。
下面，我们会删除刚才添加的检查语句event.target == this，并在按钮的单击处理程序中添加一些代码：
复制代码 代码如下:
| 代码如下 | 复制代码 |
| $(document).ready(function(){ $('#switcher .button').click(funtion(event){ //…… event.stopPropagation(); }) }) |
|
同以前一样，需要为用作单击处理程序的函数添加一个参数，以便访问事件对象。然后，通过简单地调用event.stopPropagation()就可以避免其他所有DOM元素响应这个事件。这样一来，单击按钮的事件会被按钮处理，而且只会被按钮处理。单击样式转换器的其他地方则可以折叠和扩展整个区域。
简单的实现了一下，整了半天，代码如下：
| 代码如下 | 复制代码 |
|
click here nothing happen,you can click beside this area |
|
-
上一个： js动态改变表格单元格内容例子
相关文章
- HTML简单购物数量小程序代码展示 10-31
- html canvas实现弹幕功能 10-31
- HTML中空格表示的意义 10-31
- html area标签解读 10-31
- html使用表单标签实现注册页面代码展示 10-31
- 使用HTML截图并保存为本地图片的代码展示 10-31