消除onkeydown事件按回车后出现的声音

最新推荐文章于 2021-12-28 16:49:43 发布

原创最新推荐文章于 2021-12-28 16:49:43 发布 · 2.6k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#input #action #function #web开发

Web 专栏收录该内容

36 篇文章

订阅专栏

本文介绍了一种在网页开发中消除表单提交时键盘事件触发的声音的方法。通过在JavaScript事件处理函数中添加event.returnValue=false;可以有效阻止此现象。文章还提供了具体的HTML和JavaScript代码示例。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

WEB开发时，我们常常会在文本框的onkeydown事件中做一些处理，如按了回车后执行查询或者跳到下一个输入框，请看下面代码：

<html> <head> <title>消除onkeydown事件的声音</title> <mce:script type="text/javascript"></mce:script> </head> <body> <form action="#" name="myform" method="post"> <input name="contenta" type="text" value="按回车我就叫1" onkeydown="queryData()"/></br> <input name="contentb" type="text" value="按回车我就叫2"/></br> </form> </body> </html>

在该表单文本框中按下回车，会听到“咚”的一声，键盘事件触发杨声器发出的声音，这样如果用户使用时用户体验不是很好，那么该问题如果解决呢，很简单，在做表单submit之前，加上event.returnValue = false ;完整代码如下：

<html> <head> <title>消除onkeydown事件的声音</title> <mce:script type="text/javascript"></mce:script> </head> <body> <form action="#" name="myform" method="post"> <input name="contenta" type="text" value="按回车我就叫1" onkeydown="queryData()"/></br> <input name="contentb" type="text" value="按回车我就叫2"/></br> </form> </body> </html>

注意：这种发声情况发生的条件：

1. 页面中必须有form;

2. 页面中至少有两个input框，一个时不会发生;

mce:script字样是优快云自动加上的，可能为了支持script标签正常显示.