下面小编就为大家带来一篇浅谈jQuery 中的事件冒泡和阻止默认行为。小编举得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
1、事件冒泡
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%><% String path = request.getContextPath(); String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/"; %>外层div元素
内层span元素
外层div元素
元素时,会触发自身及外层 事件冒泡可能会引起意料之外的效果,有时候需要阻止事件的冒泡行为,使用 stopPropagation() 方法来实现。 修改 元素的 click 事件函数: 内层span元素被单击 此时点击内部 元素时,只会触发自身的 click 事件,不会再向上冒泡。 2、阻止默认行为 有时候用户的操作未满足某些条件时,需要阻止某些元素的默认行为,如链接的跳转和表单的提交等,jQuery 提供了 preventDefault() 方法来实现。 当用户未填写用户名时,阻止表单提交: 如果想同时阻止事件冒泡和阻止元素默认行为,可以在事件函数中返回 false 来代替调用 stopPropagation() 和 preventDefault() 方法。 如: 内层span元素被单击 以上就是浅谈jQuery 中的事件冒泡和阻止默认行为的详细内容,更多请关注0133技术站其它相关文章! //为 元素绑定 click 事件 $("span").click(function(event) { //为方法添加一个事件对象参数 $("#msg").html($("#msg").html() + "
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%><% String path = request.getContextPath(); String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/"; %>
$(":submit").click(function(event) { //为方法添加一个事件对象参数 //当未输入用户名时,提示并阻止提交 if ($(":text").val() == "") { $("#msg").text("用户名不能为空"); return false; //阻止提交按钮的默认行为(提交表单)和事件冒泡 } });$("span").click(function(event) { //为方法添加一个事件对象参数 $("#msg").html($("#msg").html() + "