JQuery阻止默认行为

最新推荐文章于 2024-06-24 15:18:03 发布

小黑马的博客

最新推荐文章于 2024-06-24 15:18:03 发布

阅读量2.1k

点赞数

分类专栏： JQuery 文章标签： JQuery阻止默认行为

本文链接：https://blog.csdn.net/qq_38857578/article/details/82053508

版权

JQuery 专栏收录该内容

4 篇文章 1 订阅

订阅专栏

有时候用户的操作未满足某些条件时，需要阻止某些元素的默认行为，如链接的跳转和表单的提交等，jQuery 提供了 preventDefault() 方法来实现。当用户未填写用户名时，阻止表单提交：

Demo：

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<script src="../scripts/jquery-1.3.1.js"></script>
<script type="text/javascript">
$(function(){
   $("#sub").bind("click",function(){
		 var username = $("#username").val();  //获取元素的值
		 if(username==""){     //判断值是否为空
			 $("#msg").html("<p>文本框的值不能为空.</p>");  //提示信息
			 //return false;
		     //event.preventDefault();  //阻止默认行为 ( 表单提交 )
		 }
   })
})
</script>
</head>
<body>
<form action="/index.html">
用户名：<input type="text" id="username"  value="" />
<br/>
<input type="submit" value="提交" id="sub"/>
</form>
<div id="msg"><b>我是divmsg</b></div>
</body>
</html>

如果不使用 return false;或event.preventDefault(); 还是会进行进行默认的提交事件，使用事件即可阻止。