javascript阻止默认事件

最新推荐文章于 2024-05-12 21:38:39 发布
最新推荐文章于 2024-05-12 21:38:39 发布
阅读量1.3k 收藏
点赞数
分类专栏： javascript 文章标签： javascript div function login input html
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/linshizhan/article/details/7722966
版权

    有时候用户填写表单后，可能信息输入不完整，这时候我们可以利用javascript验证表单输入的完整性，如果用户输入不合法的话，我们就阻止用户提交。还比如说点击超链接的时候，用户有可能没有权限，我们也可以利用javascript阻止。

  阻止默认事件的方法：

  ie中： window.event.returnValue=false;

  火狐中：event.preventDefault();

  我们也可以直接使用return false来阻止默认事件的发生。

  下面是测试代码：

  当输入的用户名是 shizhan的时候，就阻止提交表单，

  当输入的是其他的，就提交表单。

  

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<script type="text/javascript">
		    function login(event)
		    {
		    	var v1 = document.getElementById("id1");
				var name = v1.value;
				var form1 = document.getElementById("form1");
				if(name=="shizhan")
				{
					var div1 = document.getElementById("div1");
					div1.innerHTML="被阻止了,不能提交表单";
					
					if(document.attachEvent)
					{
					   window.event.returnValue=false;
					}
					else
					{
					  event.preventDefault();
					}
					//return  false;
				}
				/*else
				{
				   form1.submit();
				}*/
		    }
			window.onload =function()
			{
			   var btn1 = document.getElementById("btn1");
			   btn1.onclick = login;
			}
		</script>
	</head>
	<body>
        <form action="1.html" id="form1" >
        	<input type="text"  id="id1"/>
        	<input  type="submit" value="提交" id="btn1" />
        	<div id="div1">
        		
        	</div>
        </form>
	</body>
</html>


 

shizhan1881
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
JavaScript阻止事件冒泡示例分享
10-24
在JavaScript中，有多种方法可以实现阻止事件冒泡： 1. 使用`event.stopPropagation()`方法：这是W3C标准的方法，适用于Firefox、Chrome、Safari、Opera等非IE浏览器。调用此方法后，事件将不会继续向上冒泡，事件...
JavaScript常见火狐Firefox、IE浏览器兼容问题
weixin_30378623的博客
09-12 125
1、关于event的用法 IE 中可以直接使用 event 对象，而 FF 中则不可以 解决方法一：var theEvent = window.event || arguments.callee.caller.arguments[0]; 解决方法二：是将 event 作为参数来传递function xxx(ev){var oEvent = event || ev;} 2、事件对象获取...
js中preventDefault方法，怎么兼容Firefox？
huaishuming的专栏
03-19 4609
兼容浏览器使用jquery的 event.preventDefault();//取消默认行为 event.stopPropagation();//取消冒泡 如果不兼容FF 请用event.preventDefault();//取消默认行为 试试
【JavaScript】阻止事件冒泡和默认行为
最新发布
小秀的博客
05-12 848
在JavaScript中，事件默认行为是指在特定的事件发生时浏览器自动执行的操作。form 元素 的 action 属性值表单内容要提交的地址，而用户点击表单元素中嵌套的提交按钮时，就会有一个默认的提交操作。需要注意的是，不同的事件有不同的默认行为，因此阻止默认行为的方法可能会有所不同。方法用于阻止事件的进一步传播，而不是直接阻止事件的默认行为。也是 event的一个属性，表示默认行为是否被阻止，true 表示被阻止。方法用于阻止事件传播，而不是直接阻止事件的默认行为。可以阻止默认行为的执行。
前端面试题01
m0_49416118的博客
07-01 830
哪种http状态下，浏览器会产生两次http请求？C A.400 请求报文中存在语法错误 B.404 服务器上无法找到请求资源 C.302 临时性重定向（请求的资源被分配了新的URL，希望本次访问使用新的URL） D.304 客户端发送附带条件请求时，请求满足条件的情况下，服务器端允许访问资源并返回状态码 根据HTML规范，以下代码中，外层容器outer的宽高分别是：D </head> <body> <div class="outer">outer &..
JavaScript阻止默认事件
weixin_47306019的博客
11-16 4053
阻止默认事件： 标准浏览器：事件对象.preventDefault(); 低版本IE浏览器：事件对象.returnValue= false;常见默认事件： 若a标签在html中href写有URL默认的跳转地址 则在js中添加a的点击事件，并用event.preventDefault();阻止默认事件发生 实际项目中 a标签在html中写 让a标签执行js程序， 然后在js中用
专项练习9
申小兮和林小兮的博客宝
06-22 1068
阻止事件使用，match() 方法，jQuery中HTTP的GET请求，求数组元素总和
关于javascript冒泡与默认事件的使用详解
09-05
JavaScript中的冒泡与默认事件是理解事件处理机制的关键概念，尤其在构建交互式的网页应用时。本文将深入探讨这两个概念，并通过示例代码进行详细解释。 首先，让我们了解什么是事件冒泡。事件冒泡是指当一个事件...
浅谈javascript事件取消和阻止冒泡
10-24
如果我们不希望这个行为发生，可以使用`event.preventDefault()`方法（在W3C标准中）或在Internet Explorer（IE）中设置`event.returnValue = false`来阻止默认行为。对于兼容性考虑，我们可以编写如下的事件处理...
vue 遮罩层阻止默认滚动事件操作
10-15
Vue提供了优雅的方式来处理这种情况，主要是通过事件修饰符来阻止默认的滚动行为。 首先，我们可以利用Vue的事件修饰符`.prevent`来阻止触摸移动事件（`touchmove`）的默认行为。当在遮罩层元素上添加`@touchmove....
web前端开发工程师面试题积累（02）
qq_39224105的博客
05-17 2032
这都是自己之前在面试过程中，做的笔试题目，千里之行，始于足下。基础最重要，把每次遇到的问题，不管是不会的还是会的，都再学习一遍，温故而知新吧。加油鸭~~~！！！ 选择题 1.关于html和模型，下列说法正确的是？ A. margin是内边距 B.padding是外边距 C.border是边框 D.border-radius是css3标准，因此IE并不支持border-radius属性 2.在HTML页面上包含如下所示的层对象，则javascript语句 document，getElementById(“in
Js阻止事件冒泡与阻止默认事件
weixin_44562686的博客
12-15 2184
1、event.stopPropagation()方法 event.stopPropagation()方法阻止事件冒泡到父元素，阻止任何父事件处理程序被执行。不让事件向documen上蔓延，但是默认事件任然会执行，当你掉用这个方法的时候，如果点击一个连接，这个连接仍然会被打开。 提示：请使用 event.isPropagationStopped()方法来检查指定的事件上是否调用了该方法。 2、event.preventDefault()方法 取消事件的默认动作。该方法将通知 Web 浏览器不要执行与事件关联
Javascript如何阻止事件的默认行为？
178技术
10-29 7550
阻止浏览器默认行为和防止事件传播主要通过先下面两个方法实现 event.preventDefault()：取消浏览器对当前事件的默认行为，比如点击链接后，浏览器跳转到指定页面，或者按一下空格键，页面向下滚动一段距离。 event.stopPropagation()：阻止事件在DOM中继续传播，防止再触发定义在别的节点上的监听函数。 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF..
html5拖拽，要在ondragover阻止这个默认事件,和解决火狐上的兼容问题
qq_39634880的博客
05-19 4366
在火狐上不兼容这一套： &lt;!DOCTYPE html&gt; &lt;html&gt; &lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;title&gt;&lt;/title&gt; &lt;style&gt; * { margin: 0;
给定两个以字符串形式表示的非负整数 num1 和 num2，返回 num1 和 num2 的乘积，它们的乘积也表示为字符串形式。
tiantianbuju123的博客
03-21 612
给定两个以字符串形式表示的非负整数num1和num2，返回num1和num2的乘积，它们的乘积也表示为字符串形式。
【JavaScript-13】阻止事件的默认行为+键盘表单事件
前端代码小白的日常博客
07-09 1889
event.stopPropagation();event.preventDefault();通常写在第一行例1）如a标签不需要写onclick直接点击便可以跳转，此处写阻止默认行为，就是阻止a的点击行为 例2）阻止默认行为，阻止右击页面自带的弹框 二、键盘和表单事件 1.按键 回车键的获取e.keyCode = “13”; keypress 按键按下的时候触发，不能识别功能键，比如ctrl shift 左右按键注意：只有有输入的地方才会使用...
JavaScript事件处理详解
通过修改默认事件处理器，开发者可以控制用户交互的行为，例如，阻止链接默认的跳转行为。" 在JavaScript中，事件是用户与网页交互的触发点，例如点击按钮、滚动页面或填写表单。这些交互由浏览器捕获并触发相应的...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值