【JS基础】e.preventDefault() 阻止默认操作

最新推荐文章于 2024-06-24 15:18:03 发布
最新推荐文章于 2024-06-24 15:18:03 发布
阅读量3.1w 收藏 79
点赞数 22
分类专栏： JavaScript 文章标签： javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_43352901/article/details/107811768
版权
本文探讨了如何在JavaScript中阻止元素的默认行为，重点讲解了`e.preventDefault()`方法及其与IE的`e.returnValue = false`的区别。同时提到了`return false`在阻止默认行为中的作用，以及在不同场景下的适用情况。总结了阻止默认行为的常见方法，并提醒读者注意事件处理中的event对象特性和有效期。
摘要由CSDN通过智能技术生成

阻止默认操作

默认操作 具体指的是什么呢？看如下实例：

  • 把单击事件处理程序注册到一个锚元素，而不是一个外层的上，那么就要面对另外一个问题：当用户单击链接时，浏览器会加载一个新页面。
  • 当用户在编辑完表单后按下回车键时，会触发表单的submit事件，在此事件发生后，表单提交才会真正发生。这种行为与我们讨论的事件处理程序不是同一个概念，它是单击标签元素的默认操作。

在这种情况下，处理方法有：

1.w3c的方法是e.preventDefault()，IE则是使用e.returnValue = false

preventDefault它是事件对象(Event)的一个方法，作用是取消一个目标元素的默认行为。

既然是说默认行为，当然是元素必须有默认行为才能被取消，如果元素本身就没有默认行为，调用当然就无效了。

什么元素有默认行为呢？如链接<a>，提交按钮<input type=”submit”>等。

当Event 对象的 cancelable为false时，表示没有默认行为，这时即使有默认行为，调用preventDefault也是不会起作用的。

<a href="http://www.baidu.com" id="testA" >baidu.com</a>

var a =
最低0.47元/天 解锁文章
Milk595
关注
专栏目录
event.preventDefault() 和 event.stopPropagation()方法之间有什么区别？如何知道是否在元素中使用了event.preventDefault()方法？
liuhao9999的博客
03-22 1028
event.preventDefault()方法可防止元素的默认行为。如果在表单元素中使用，它将阻止其提交。如果在锚元素中使用，它将阻止其导航。如果在上下文菜单中使用，它将阻止其显示或显示。event.stopPropagation()方法用于阻止捕获和冒泡阶段中当前事件的进一步传播。 我们可以在事件对象中使用event.defaultPrevented属性。它返回一个布尔值用来表明是否在特定元素中调用了event.preventDefault()。 ...
关于js里面e.preventDefault()
qaz980930841的博客
01-09 6497
定义和用法 preventDefault() 方法阻止元素发生默认的行为（例如，当点击提交按钮时阻止对表单的提交）。 document.onclick=function(e){ e.preventDefault();      //阻止元素发生默认行为 if(e.target!=document.getElementById("myInput")){ hidePage
e.preventDefault()阻止默认行为
czlj1998的博客
09-25 1479
因此，通过在输入框的onKeyUp事件中检查keyCode是否为13（回车键的keyCode为13），如果是，则使用preventDefault()方法阻止默认行为，即阻止表单提交。例如，你可以在按下回车键时阻止表单的默认提交行为，或者在按下空格键时阻止滚动页面的默认行为。，可以阻止链接的默认跳转行为，从而允许你在点击链接时执行自定义操作，比如打开一个模态框或执行一些其他逻辑。按钮点击：在处理按钮点击事件时，有时你可能希望阻止按钮的默认提交行为或页面刷新行为。表单提交：在处理表单提交事件时，通过调用。
JS阻止事件默认行为的三种方法
最新发布
m0_74577714的博客
06-24 685
大家有没有为默认行为感到烦恼呢？我这有三个方法可以为大家解决。好上才艺。
js中的preventDefault与stopPropagation详解
12-12
首先讲解一下js中preventDefault和stopPropagation两个方法的区别：preventDefault方法的起什么作用呢？我们知道比如<a>百度</a>,这是html中最基础的东西，起的作用就是点击百度链接到http://www.baidu.com,这是属于<a>标签的默认行为，而preventDefault方法就是可以阻止它的默认行为的发生而发生其他的事情。看一段代码大家就明白了： 代码如下:<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN”
js中的preventDefault和stopPropagation
weizuqing的专栏
01-07 222
首先讲解一下js中preventDefault和stopPropagation两个方法的区别： preventDefault方法的起什么作用呢？我们知道比如百度,这是html中最基础的东西，起的作用就是点击百度链接到http://www.baidu.com,这是属于标签的默认行为，而preventDefault方法就是可以阻止它的默认行为的发生而发生其他的事情。看一段代码大家就...
e.preventDefault();
chenchengdexiaoxiao的博客
02-11 267
比如一个button放在一个form中，这个button的Default就是提交（submit），但如果你不想让他提交，就可以用e.preventDefault(); 打个比方： $(document).ready(function(){ $("button").click(function(e){ $("...
e.preventdefault()方法阻止元素发生默认的行为（例如，当点击提交按钮时阻止对表单的提交）。...
weixin_30662011的博客
10-18 1235
语法：event.preventDefault()参数：event 必需 规定阻止哪个事件的默认动作。这个event参数来自事件绑定函数。例：a上面的url将不被打开 $("a").click(function(event){ event.preventDefault(); }); 转载于:https://www.cnblogs.com/chenxiaomei0104/p/9811...
e.preventDefault()是什么
weixin_42610010的博客
12-31 2455
e.preventDefault() 是一个 JavaScript 函数，它可以阻止浏览器的默认行为。例如，当你点击一个超链接时，浏览器会自动跳转到超链接指向的页面，这就是浏览器的默认行为。如果你希望在点击超链接时不跳转，可以在超链接的事件处理函数中使用 e.preventDefault() 来阻止浏览器的默认行为。 例如，假设你有一个超链接： <a href="/some/page"&gt...
return false;和e.preventDefault();的区别
09-05
` 是一个简化的写法，它同时处理了阻止默认行为和阻止事件冒泡，而 `e.preventDefault();` 只处理阻止默认行为。在编写代码时，你应该根据具体需求来选择使用哪种方法。如果只关心阻止默认行为，`e.preventDefault()...
JQuery事件e参数的方法preventDefault()取消默认行为
10-26
2. 阻止默认行为：`preventDefault()`方法用于阻止元素的默认动作。例如，它能够阻止表单的提交、链接的跳转、图片的默认上下文菜单的弹出等。 3. 浏览器兼容性：`e.preventDefault()`在多数现代浏览器中都得到支持...
没有e.preventDefault();方法
07-11
确实在 Echarts 的鼠标滚动事件中没有提供 `e.preventDefault()` 方法来阻止默认的滚动行为。 为了解决这个问题，你可以使用 `e.event.preventDefault()` 来阻止默认的滚动行为。具体步骤如下： ```javascript ...
e.preventDefault
qq_22912891的博客
05-09 2044
有时候点击提交按钮会有一些默认事件。比如跳转到别的界面。但是如果没有通过验证的话，就不应该跳转。这时候可以通过设置event.preventDefault(); //阻止默认行为 ( 表单提交 )。 下面是案例： "text/javascript"> $(function(){ $("#sub").bind("click",function(event){
js的preventDefault()
qq_41045651的博客
07-12 1806
当用户与页面进行交互时，比如点击链接、提交表单等，浏览器会根据事件的默认行为执行相应的操作。但有时候我们希望在事件发生时取消默认行为，这时就可以使用。方法只能阻止事件的默认行为，但并不会停止事件的传播（冒泡或捕获）。如果需要完全停止事件的传播，可以使用。方法，阻止了链接的默认跳转行为。方法通常用于事件处理函数中，它可以阻止事件的默认行为发生，从而实现自定义的操作。在上述示例中，当用户点击链接时，事件处理函数被触发。是一个 JavaScript 方法，常用于阻止事件的默认行为。// 阻止链接的默认跳转行为。
js中的preventDefault
盗墓笔记
01-06 1311
preventDefault方法就是可以阻止它的默认行为的发生而发生其他的事情。 JS阻止链接跳转 function stopDefault(e) { if (e && e.preventDefault) {//如果是FF下执行这个 e.preventDefault(); }else{ window.event.returnVa
关于e.preventDefault()方法
weixin_43821171的博客
09-22 7940
背景： 同事在项目中遇到的问题，在项目中导入了某一个组件作为根组件之后，发现原来的子组件中的滚动效果不再生效，因为是移动端的项目，所以这里的滚动效果是通过touchmove事件进行触发的，在对引入的组件进行研究后，发现是在根组件中阻止了touchmove事件的默认事件，也就是调用了e.preventDefault()方法，然后同事们通过阻止冒泡阻止了这个方法的调用，解决掉了因为引入组件而带来的问题，但这却引发了一连串的有关于preventDefault()这个方法的思考。 问题： 为什么我在父组件上使用pr
e.preventdefault()别滥用
seeseeyoua的博客
05-11 789
有的时候我们会为事件回调函数添加一个参数（通常是e），并在函数中加入e.preventdefault()；以取消默认行为。由于习惯，我顺手将它写到了一个checkbox的change事件中。由于不同的浏览器解释不同，在IE8上出现了一个bug：change事件能进入，但是UI显示上不能讲复选框的选中状态重绘。 分析原因，是我的e.preventdefault()阻止了状态重绘。去掉后，就好了。 e.preventdefault()会阻止什么： checkbox 、radio的状态变化(并非所有浏览器)。 a
JS - e.preventDefault()与e.stopPropagation()
kelly0721的博客
02-10 2227
事件冒泡 e.stopPropagation()阻止事件冒泡 事件冒泡，就是字元素的onClick事件被触发时，会同时触发父元素的 onClick 事件 一般来讲，click事件的顺序应该是p -> div -> body -> html -> document 所以，以下代码的触发顺序是 children -> parent -> body 如果 e.st...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值