文章目录
1、一开始是粗暴的禁用回车事件,但是这样会导致其他需要回车触发的事件也执行不了。(推荐⭐⭐)
ducoment.onkeydown = (e) => {
if(e.keyCode == 13) {
return false;
}
}
2、绑定某个按钮,只有聚焦时,回车才生效(推荐⭐⭐⭐⭐⭐)
/* 鼠标聚焦时,回车事件 */
$("#search_ipt").bind("keypress", function(){
if (event.keyCode == 13){
// 触发需要调用的方法
$("#search_but").click();
}
})
3、全局绑定 (不推荐,除非控制好if条件)
$(document).keypress(function(e) {
if((e.keyCode || e.which)==13) {
// 触发需要调用的方法
$("#search_ipt").click();
}
});
4、按enter回车无限触发事件 解决:失去焦点
<template>
<div>
<el-button @click="clickBtn">新增</el-button>
</div>
</template>
<script>
export default {
methods: {
// 点击事件
clickBtn (e) {
let target = e.target
// 根据button组件内容 里面包括一个span标签,如果设置icon,则还包括一个i标签,其他情况请自行观察。
// 所以,在我们点击到button组件上的文字也就是span标签上时,直接执行e.target.blur()不会生效,所以要加一层判断。
if (target.nodeName === 'SPAN' || target.nodeName === 'I') {
target = e.target.parentNode
}
// 让其失去焦点
target.blur()
}
}
}
</script>
5、keyCode对照表