前几天写的 响应键盘的图片切换 中, 键盘总是让浏览器滚动，为了取消掉默认的事件，使用了 preventDefault() 方法

定义和用法

preventDefault() 方法取消事件的默认动作。

语法

  1. event.preventDefault()

说明

该方法将通知 Web 浏览器不要执行与事件关联的默认动作（如果存在这样的动作）。例如，如果 type 属性是 "submit"，在事件传播的任意阶段可以调用任意的事件句柄，通过调用该方法，可以阻止提交表单。注意，如果 Event 对象的 cancelable 属性是 fasle，那么就没有默认动作，或者不能阻止默认动作。无论哪种情况，调用该方法都没有作用。

  1. //响应键盘
  2. $(document).keydown(function(event){
  3.    event = event || window.event;
  4.    if(event.keyCode==38 || event.keyCode==37){
  5.     clearInt();
  6.     roll(-1);
  7.    event.preventDefault(); //这里取消掉键盘触发的默认事件
  8.     };
  9.    if(event.keyCode==40 || event.keyCode==39){
  10.     clearInt();
  11.     roll(1);
  12.     };
  13.     event.preventDefault();
  14.    })
  1. <!doctype html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <title>无标题文档</title>
  6. <style>
  7. #ss{
  8.     width:400px;
  9.     height:400px;
  10.     background-color:#0F0;}
  11. </style>
  12. </head>
  13.  
  14. <body>
  15. <form action="/" method="post">
  16.     用户名：<input type="text" name="username"><br />
  17.     密码：<input type="text" name="password">
  18.     <input type="submit" value="注册">
  19.  
  20. </form>
  21. <script type="text/javascript">
  22.     var fm=document.getElementsByTagName("form")[0];
  23.     fm.addEventListener('submit',function(event){
  24.         alert("tj");
  25.         return false //dom1级下生效
  26.         event.preventDefault();
  27.     })
  28.  
  29. </script>
  30. </body>
  31. </html>

preventDefault() 方法 取消掉与事件关联的默认动作的更多相关文章

  1. 事件的preventDefault方法

    事件有一个preventDefault()方法,该方法可以用来取消事件的默认行为.许多事件都有默认执行的关联行为.例如,如果用户在文本字段中键入一个字符,则默认行为就是在文本字段中显示该字符.由于可以 ...

  2. 关于ElementUI中MessageBox弹框的取消键盘触发事件(enter,esc)关闭弹窗(执行事件)的解决方法

    好久没见了 在项目中遇到一个小小的需求,总结了一下! 详细我就不介绍了,相信大家用过的话,很了解.详见文档-----------> http://element-cn.eleme.io/#/zh ...

  3. 使用事件的preventDefault()方法改变默认行为

    事件有属性,还有方法,还有事件.事件本身是个对象^_^ 事件的preventDefault()方法改变默认行为,在事件发生前阻止,不让其发生.这样的应用场景有很多,常见表单验证,如必填字段不能为空. ...

  4. js 阻止事件冒泡和默认行为 preventDefault、stopPropagation、return false

    preventDefault: preventDefault它是事件对象(Event)的一个方法,作用是取消一个目标元素的默认行为.既然是说默认行为,当然是元素必须有默认行为才能被取消,如果元素本身就 ...

  5. event.preventDefault方法的使用

    event.preventDefault()方法是用于取消事件的默认行为,例如,当点击提交按钮时阻止对表单的提交.但此方法并不被ie支持,在ie下需要用window.event.returnValue ...

  6. JS021. 拦截事件的显式处理与默认动作（Web API: event.preventDefault）

    Web API - event.preventDefault( ) Event 接口的  preventDefault( ) 方法,告诉 user agent :如果此事件没有被显式处理,它默认的动作 ...

  7. 原生JS事件绑定方法以及jQuery绑定事件方法bind、live、on、delegate的区别

    一.原生JS事件绑定方法: 1.通过HTML属性进行事件处理函数的绑定如: <a href="#" onclick="f()"> 2.通过JavaS ...

  8. AndroidStudio里面怎么取消与SVN的关联

    在公司做项目 遇到SVN解除关联的问题 后经过解决: 1.解除文件的关联方法: 1.1. 创建一个reg文件 如下 1.2 在文件中填入如下内容并保存: Windows Registry Editor ...

  9. preventDefault()方法

    必须在dragend和dragover事件内调用“事件对象.preventDefault()”方法.因为在默认情况下,拖放的目标元素是不允许接受元素的,为了把元素拖放到其中,必须把默认处理给关掉.目前 ...

随机推荐

  1. Razor 语法

    Razor 语法 原文:Razor Syntax Reference作者:Taylor Mullen.Rick Anderson翻译:刘怡(AlexLEWIS)校对:何镇汐   什么是 Razor? ...

  2. 变量-if else while-运算符

    变量: SQL语言也跟其他编程语言一样,拥有变量.分支.循环等控制语句. 在SQL语言里面把变量分为局部变量和全局变量,全局变量又称系统变量. 局部变量: 使用declare关键字给变量声明,语法非常 ...

  3. Erget 显示对象

    核心显示类: 类 描述 DisplayObject 显示对象基类,所有显示对象均继承自此类 Bitmap 位图,用来显示图片 Shape 用来显示矢量图,可以使用其中的方法绘制矢量图形 TextFie ...

  4. 蓝牙-b

    最近智能家居比较火,好多公司开始开发通过蓝牙对智能家居进行连接控制!下面,我就把自己总结的蓝牙方面的知识分享一下!求吐槽!!!!O(∩_∩)O... 1.导入头文件#import <CoreBl ...

  5. poj 2528Mayor's posters

    http://poj.org/problem?id=2528 这个题有个细节,整个区间的长度为10000000,而n最大只有1000,所以我们要进行离散化. #include<cstdio> ...

  6. 等待事件--db file sequential read

    对于最小化db file sequential read 事件所带来的影响,你可以做的另一件事情是减少AVERAGE_WAIT时间. 这是会话必须等待从磁盘提取单块的平均时间,这些信息可以从v$ses ...

  7. vs2010旗舰版产品密钥

    Microsoft Visual Studio 2010(VS2010)正式版 CDKEY / SN: YCFHQ-9DWCY-DKV88-T2TMH-G7BHP 企业版.旗舰版都适用

  8. 格式化字符串format函数

    自python2.6开始,新增了一种格式化字符串的函数str.format(),可谓威力十足.那么,他跟之前的%型格式化字符串相比,有什么优越的存在呢?让我们来揭开它羞答答的面纱. 语法 它通过{}和 ...

  9. [LeetCode] 205. Isomorphic Strings 解题思路 - Java

    Given two strings s and t, determine if they are isomorphic. Two strings are isomorphic if the chara ...

  10. Fork 一个仓库并同步

    Fork 一个示例仓库 Fork 是对一个仓库的克隆.克隆一个仓库允许你自由试验各种改变,而不影响原始的项目. 一般来说,forks 被用于去更改别人的项目(贡献代码给已经开源的项目)或者使用别人的项 ...