用js怎么写一个回车键盘事件

如题所述

一、设计思路:设计一个简单的输入对话框,然后按下enter进行输入事件。

二、聊天输入框的代码如下:

三、此时的页面展示如下:

四:设计函数,使得输入文字时,按下按钮可以提交到聊天框。

五、此时在页面上测试,输入一段文字:

六、执行结果如下:

七、设计函数,使得按下enter跟按钮同样的功能:

八、刷新页面,测试:

温馨提示:内容为网友见解,仅供参考
第1个回答  2018-12-19

<script type="text/javascript" language=JavaScript charset="UTF-8">

document.onkeydown=function(event){

var e = event || window.event || arguments.callee.caller.arguments[0];

if(e && e.keyCode==27){ // 按 Esc

//要做的事情

}

if(e && e.keyCode==113){ // 按 F2

//要做的事情

}

if(e && e.keyCode==13){ // enter 键

//要做的事情

}

};

</script>

扩展资料:

Js键盘事件

keydown:按键按下

keyup:按键抬起

keypress:按键按下抬起

<body>

<input id="name" type="text" onkeydown="myKeyDown(this.id)" onkeyup="myKeyUp(this.id)">

</body>

<script>

/*输出输入的字符*/

function myKeyDown(id) {

console.log(document.getElementById(id).value);

}

/*按键结束,字体转换为大写*/

function myKeyUp(id) {

var text = document.getElementById(id).value;

document.getElementById(id).value = text.toUpperCase();

}

</script>

常用的键盘事件对应的键码:

keyCode 8 = BackSpace BackSpace  

keyCode 9 = Tab Tab

keyCode 12 = Clear

keyCode 13 = Enter

keyCode 16 = Shift_L

keyCode 17 = Control_L

keyCode 18 = Alt_L

keyCode 19 = Pause

keyCode 20 = Caps_Lock

keyCode 27 = Escape Escape

本回答被网友采纳
第2个回答  2018-06-17

用js写一个回车键盘事件如下:

$('#search_input').bind('keyup', function(event) {

if (event.keyCode == "13") {

//回车执行查询

$('#search_button').click();

}

}); 

JS监听某个DIV区域

$("#queryTable").bind("keydown",function(e){

// 兼容FF和IE和Opera

var theEvent = e || window.event;

var code = theEvent.keyCode || theEvent.which || theEvent.charCode;

if (code == 13) {

//回车执行查询

$("#queryButton").click();

}

});

说明:只要定义了这些键的动作,在浏览器里按下这些键就会响应,兼容目前所有浏览器。

拓展资料

javascript是一种由Netscape的LiveScript发展而来的原型化继承的面向对象的动态类型的区分大小写的客户端脚本语言,主要目的是为了解决服务器端语言,比如Perl,遗留的速度问题,为客户提供更流畅的浏览效果。

当时服务端需要对数据进行验证,由于网络速度相当缓慢,只有28.8kbps,验证步骤浪费的时间太多。于是Netscape的浏览器Navigator加入了Javascript,提供了数据验证的基本功能。

本回答被网友采纳
第3个回答  2012-07-07
<script type="text/javascript" language=JavaScript charset="UTF-8">
document.onkeydown=function(event){
var e = event || window.event || arguments.callee.caller.arguments[0];
if(e && e.keyCode==27){ // 按 Esc
//要做的事情
}
if(e && e.keyCode==113){ // 按 F2
//要做的事情
}
if(e && e.keyCode==13){ // enter 键
//要做的事情
}
};
</script>
只要你定义了这些键的动作,你在浏览器里按下这些键就会响应,兼容目前所有浏览器。本回答被提问者和网友采纳
第4个回答  2019-02-11

<body>
    <input type="button" id="ボタン" value="input要素にEnter事件を配布する">
    <input type="text" id="input要素" value="input要素">
    <div id="状态ボード"></div>
</body>
<script>
    //下准备
    const 要素 = {
        ボタン: document.querySelector("#ボタン"),
        input要素: document.querySelector("#input要素"),
        状态ボード: document.querySelector("#状态ボード"),
    }
    //初期化
    const 初期化 = () => {
        要素.ボタン.addEventListener("click", event => {
            const ent = new KeyboardEvent("keyup", {"key": "Enter"})
            要素.input要素.dispatchEvent(ent)
        })
        要素.input要素.addEventListener("keyup", event => {
            if(event.key == "Enter"){
                要素.状态ボード.innerHTML = `input要素の内容は「${要素.input要素.value}」でございます。`
            }
        })
    }
    //初期化スタート!!
    初期化()
</script>

相似回答