form内任意一个输入框按enter会触发的submit的click事件
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<form action="javascript:;" method="post">
用户名：<input type="text" name="" id="" value="" />
密码：<input type="text" name="" id="" value="" />
确认密码：<input type="text" name="" id="" value="" />
<input type="submit" value="提交"/>
</form>
</body>
<script type="text/javascript">
document.querySelector('input[type=submit]').onclick=function(){
console.log(this);
console.log(event.target);
};
</script>
</html>
form内任意一个输入框按enter会触发的submit的click事件，这是浏览器自动处理的吗，怎么禁止啊
19
收起
正在回答
2回答
同学你好，一般情况下没有按下enter键跳转到下一个输入框的情况。如果想要js实现也是可以的。例如：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<form method="post">
用户名：<input type="text" name="" id="" value="" onkeydown="changeEnter()" /> 密码：
<input type="text" name="" id="" value="" onkeydown="changeEnter()" /> 确认密码：
<input type="text" name="" id="" value="" onkeydown="changeEnter()" />
<!-- <input type="submit" value="提交" /> -->
<!-- 按钮变为普通的 -->
<input type="button" value="提交" />
</form>
</body>
<script type="text/javascript">
var i = 0;
var input = document.getElementsByTagName('input')
function changeEnter() {
// 判断是否为回车
if (event.keyCode == 13) {
// 如果超出了最后一个元素，将i设置为0，从头开始
if (i >= input.length - 2) { //去掉最后一个按钮input
i = 0;
input[i].focus();
} else {
// 设置下一个聚焦
input[++i].focus();
}
}
}
</script>
</html>自己测试下，祝学习愉快！
恭喜解决一个难题，获得1积分~
来为老师/同学的回答评分吧
0 星