IE 浏览器下 按下enter button自动触发click事件的解决方案

最新推荐文章于 2024-06-27 15:22:14 发布
最新推荐文章于 2024-06-27 15:22:14 发布
阅读量3.4k 收藏 2
点赞数 1
分类专栏： java学习笔记
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/xiaojunjuns1/article/details/78317039
版权

当用户焦点在输入框中的时候，当用户按了“Enter”键之后，达到设置分页显示行数的效果；所以这里就监听了input的keydown事件，当keyCode是13的时候，就发送请求或者触发登录按钮的click事件。

在其他浏览器中都没有问题，但在IE中，当我按下Enter之后，同时也触发了下面“微博”按钮的click事件。

因为当按下Enter键的时候，浏览器的焦点就自动跳到下一个“可用”button上呢，并且Enter了，只有这样才会解释上面的情况。

默认button是有type类型的 需要指定type=“button”等...所以这个问题是没有加type导致的。

也可以把button换成a标签或者阻止keydown事件的默认行为（preventDefault（））

jackson-up
关注
专栏目录
form 表单 input 敲击回车冒泡会触发附近button的click事件
小妖666个人笔记
11-11 1431
form 表单 input 敲击回车冒泡会附近按钮的 click 事件 <!DOCTYPE html> <html> <body> <form action="/demo/demo_form.asp"> First name:<br> <input type="text" name="firstname" value="Mickey"> <button type="text" onclick="changeText('bu
【WPF】textbox ctrl+enter回车 enter触发button的click事件
weixin_40185666的博客
01-11 5345
WPF textbox ctrl+enter回车 enter触发button的click事件前言界面实现思路代码总结 前言 第一次写csdn博客，就记录一下一个小功能的实现吧，最近在做和微信相关的一个插件，其中有一块是仿照微信的发送功能，即在textbox中编辑文本时，按下enter键直接发送，按下ctrl+enter触发回车。平常都没怎么注意的操作逻辑自己实现的时候还仔细思考了一下才做出来。 界...
解决button点击后按enter键还会响应click事件问题
小菜鸟的博客
11-03 902
点击button后 焦点还在button上面 所以按enter键还会响应click事件，要想解决这个问题，得把焦点从button上面移开 document.onclick = e =>{ if(e.target.tagName.toLowerCase() === "button") { e.target.blur(); } } ...
IE下，事件触发那点破烂事儿
phphot
04-29 1516
老习惯，请先看测试页面：event-test.html结论：在非IE浏览器，同一元素同一事件类型的处理函数是先进先出的。只有IE下，是先进后出。 jQuery实现了自己的一套队列机制，用jQuery注册的事件，在IE下也是先进先出的。 可以用setTimeout脱离当前队列，排到后面去。在一定程度上，这可以解决某些问题。 在jQuery中，可以用stopImme
避免点击空格或回车会触发鼠标上次的点击事件
最新发布
weixin_56383764的博客
06-27 308
项目中遇到的问题，避免点击空格或回车会触发鼠标上次的点击事件
vue elementui el-button点击后阻止空格触发点击事件
RenGaoGuang的博客
08-19 1117
1.@keyup.space.native.prevent=’‘fun’’ 在项目中使用 HTML <el-button size="mini" type="danger" @click="hDel(scope.row.id)" @keyup.space.native.prevent="fun">删除</el-button> JS fun() { console.log('空格') } 2.$(’#id’).blur() // 使按钮失.
兼容IE火狐的Enter回车快捷事件
编码青年的专栏
12-06 1727
//回车提交事件 document.onkeydown = function (event) { e = event ? event : (window.event ? window.event : null); if (e.keyCode==13) { var acco
回车触发了Button的click事件（点击回车，结果调用了按钮的点击事件----解决办法）
weixin_38345306的博客
11-23 1312
回车触发了Button的click事件（点击回车，结果调用了按钮的点击事件----解决办法）
基于jquery的button默认enter事件(回车事件)。
10-28
在HTML中，`<input type="submit">` 提供了一个默认的回车（Enter）事件，当用户在表单内输入并按下回车键时，会触发提交表单的事件。然而，对于`<input type="button">`，则没有这样的默认行为。在描述中提到，如果...
JavaScript 操作键盘的Enter事件（键盘任何事件），兼容多浏览器
10-28
通过捕捉`keydown`事件，并判断按下的键是否是Enter键（其`keyCode`值为13），可以实现当用户按下Enter键时，执行某个按钮的`click`事件，即触发按钮的点击操作。实现代码如下： ```javascript document.onkeydown ...
asp.net页面回车触发button按钮方案
11-10
在 Web 开发中，尤其是在 ASP.NET 应用程序中，我们经常需要处理用户输入数据时的操作，比如通过按下 Enter 键来触发某个操作或提交表单。这种需求在很多场景下都非常常见，比如搜索框、登录表单等。默认情况下，当...
键盘回车和鼠标点击触发button按钮click事件的问题
热门推荐
随风丶逆风的博客
09-04 1万+
一、问题描述 button按钮在获得焦点(foucs)的情况下，敲击键盘enter键也会触发button按钮的click事件，一般情况下不会有什么影响。但如果用户鼠标点击按钮后，在表单提交或者某些请求过程中，用户不停点击回车键，就会重复发起提交或者请求，如果未处理，很容易就出现错误。若涉及交易请求一类，这个问题会更加严重。（别问为什么会知道，问就是不知道） 以下面的代码为例： <!-...
在网页上使用户按Enter键自动跳到下一控件，并禁止使用鼠标右键和其他快捷键的HTC控件...
weixin_34259159的博客
04-03 106
//Function：     在网页上使用户按Enter键自动跳到下一控件，并禁止使用鼠标右键和其他快捷键 //Method：       使用HTC组件结合CSS文件将Body的Keydown事件绑定到自定义函数上 //Author：        Waxdoll Cheung //Time：           2005-01-27 21:31 //Memo：        ...
解决点击按钮后，按回车无限触发按钮事件
JunVei的博客
09-07 1432
解决点击按钮后不失焦的问题
解决按钮点击后长按回车无限触发点击事件问题
张兴华的博客
11-03 1594
思路： 包一层 UI 库的 button，在里面监听 onkeydown 和 onkeyup，用 flag 阻止长按回车一直触发。 然后在项目全局重新注册 el-button 覆盖掉UI内的按钮组件。 优点 即开即用，将组件添加到项目内，引入注册即可。 也不会阻止第一次回车触发的点击事件，保留原有逻辑。 不需要改项目中的原button代码。 使用（Element-UI） // main.js import DDButton from '@/components/button.vue'; // 覆盖
按enter执行click或者搜索问题
weixin_30646505的博客
12-07 309
最近需要将按按钮搜索的功能，改为支持按enter回车键，搜索。 实现按enter，执行click事件还是比较简单的。 //按回车搜索用户 $(window).keydown(function (event) { //alert("您按了 键"); if (event.keyCode == 13) { //a...
按enter回车，会触发button上的事件的原因及解决办法
qq_44754016的博客
01-17 5976
1、一开始是粗暴的禁用回车事件，但是这样会导致其他需要回车触发的事件也执行不了。 ducoment.onkeydown = (e) => { if(e.keyCode == 13) { return false; } } 2、产生这个问题的原因应该是 页面有form表单，有button按钮，因为button上没有加上type属性，导致了按下回车，默认触发了button提交事件。 靠谱的解决办法是 给button 加上type 属性就好了。 我有两个button都没有写type ，然后回车会触
vue项目中遇到的问题（1、点击空格或回车会触发鼠标上次的点击事件；2、自动语音播报；3、引入钉钉登录）
weixin_44402343的博客
12-10 3037
原因：因为button按钮点击之后焦点没有移除，点击空格或回车之后会继续执行button的click事件 解决办法： @keyup.prevent @keydown.enter.prevent <el-button type="primary" size="small" @click="addProject" @keyup.prevent @keydown.enter.prevent>添加项目</el-button> ............
JavaScript 兼容多浏览器的键盘Enter事件处理
然后，通过监听`onkeydown`事件，当用户按下Enter键（keyCode为13）时，模拟点击id为"qw"的按钮，并阻止默认的事件行为（防止表单自动提交）。 ```javascript document.onkeydown = function() { var EventUtil = ...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值