文档章节

js 取消回车事件

JerryYux
 JerryYux
发布于 2014/10/31 16:26
字数 283
阅读 4761
收藏 8

最近在写一个js小玩意儿,里边涉及到这样一个功能:在textarea中编辑东西完成之后,敲回车,发送消息,清空textarea;
但是出现一个bug:敲回车后,textarea里会残余一个换行符;
想来想去,应该是这个回车敲击以后,清空textarea的方法调用之后,事件还在继续,于是换行符被当做输入,进入了textarea;

如何让这个回车事件在清空textarea之后就取消呢?

在网上找到这篇文章JS阻止事件冒泡,于是在代码里加了一句

obj.preventDefault();

就解决了;

demo如下:

<html>
<head>
    <script type="text/javascript">

        function BindEnter(obj){
            if(obj.keyCode == 13){
                if (!obj.ctrlKey) {

                    document.getElementById("ta").value="";
                    obj.preventDefault();//这句话可以阻止回车事件冒泡;如果注释掉这句话,那么会有空格残余;
                } 
            }    
        }
    </script>
</head>
<body onkeydown="BindEnter(event)">
    <textarea id="ta" rows="10" cols="30">
        The cat was playing in the garden.
    </textarea>
</body>
</html>



今天看到一个帖子,发现在事件处理方法中直接return false就能阻止事件冒泡了...

© 著作权归作者所有

JerryYux
粉丝 4
博文 18
码字总数 8418
作品 0
杭州
程序员
私信 提问
js阻止浏览器的默认行为以及停止事件冒泡(用JQuery实现回车提交,兼容IE、FF浏览器) ...

在前端开发工作中,由于浏览器兼容性等问题,我们会经常用到“停止事件冒泡”和“阻止浏览器默认行为”。 1.阻止浏览器的默认行为 [java] function stopDefault(e) { //如果提供了事件对象,...

java_T
2012/07/13
0
0
说说 Vue.js 中的 v-model 指令以及如何绑定表单元素

我们可以使用 Vue.js 中的 v-model 指令来完成表单数据的双向绑定。 1 基础用法 1.1 文本输入框(text) 这里演示了在文本输入框上输入的内容,会实时映射到绑定的数据上。 html: js: 效果...

deniro
2018/12/02
0
0
为ASP.NET控件添加常用的JavaScript操作

1.为button控件添加确认功能 要想为服务器控件添加客户端的事件,需要用到Attributes属性。Attributes属性是所有的服务器控件都有的一个属性,它用来为最终生成的HTML添加自定义的一些标记。...

晨曦之光
2012/03/09
116
0
帮忙修改一下js源码可以实现回车事件

我有一个js的表格插件是在网上自己下载,但是不支持回车事件,现在客户要求使用回车可以编辑单元格。哪位js大侠帮忙修改一下,我自己搞不定了。 O(∩_∩)O谢谢大家了。

_听雨
2014/05/23
38
0
说说 Vue.js 中的 v-on 事件指令

v-on 事件指令用于绑定事件。 1 基础用法 v-on 指令绑定事件后,就会监听相应的事件。 html: 注意: 是 的简写形式, 即表示 。 js: 效果: @click 表达式即可以直接使用 js 语句,也可以是...

deniro
2018/11/24
0
0

没有更多内容

加载失败,请刷新页面

加载更多

Angular 英雄编辑器

应用程序现在有了基本的标题。 接下来你要创建一个新的组件来显示英雄信息并且把这个组件放到应用程序的外壳里去。 创建英雄组件 使用 Angular CLI 创建一个名为 heroes 的新组件。 ng gener...

honeymoose
今天
5
0
Kernel DMA

为什么会有DMA(直接内存访问)?我们知道通常情况下,内存数据跟外设之间的通信是通过cpu来传递的。cpu运行io指令将数据从内存拷贝到外设的io端口,或者从外设的io端口拷贝到内存。由于外设...

yepanl
今天
6
0
hive

一、hive的定义: Hive是一个SQL解析引擎,将SQL语句转译成MR Job,然后再在Hadoop平台上运行,达到快速开发的目的 Hive中的表是纯逻辑表,就只是表的定义,即表的元数据。本质就是Hadoop的目...

霉男纸
今天
3
0
二、Spring Cloud—Eureka(Greenwich.SR1)

注:本系列文章所用工具及版本如下:开发工具(IDEA 2018.3.5),Spring Boot(2.1.3.RELEASE),Spring Cloud(Greenwich.SR1),Maven(3.6.0),JDK(1.8) Eureka: Eureka是Netflix开发...

倪伟伟
昨天
13
0
eclipse常用插件

amaterasUML https://takezoe.github.io/amateras-update-site/ https://github.com/takezoe/amateras-modeler modelGoon https://www.cnblogs.com/aademeng/articles/6890266.html......

大头鬼_yc
昨天
6
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部