欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

JQuery阻止默认行为

程序员文章站 2022-04-30 23:42:20
有时候用户的操作未满足某些条件时,需要阻止某些元素的默认行为,如链接的跳转和表单的提交等,jQuery 提供了 preventDefault() 方法来实现。当用户未填写用户名时,阻止表单提交: Demo: 如果不使用 return false;或event.preventDefault(); 还是 ......

有时候用户的操作未满足某些条件时,需要阻止某些元素的默认行为,如链接的跳转和表单的提交等,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(); 还是会进行进行默认的 提交事件,使用事件即可阻止。