Form表单input回车提交问题

问题:文本框输入完成后点击回车页面刷新

问题出在form上,当表单中只有一个文本框的时候获取焦点并点击回车之后会提交表单内容,就会发生刷新事件。

发现问题所在就好解决问题了。

现在有三种解决方案:

1.全局禁用回车事件

function document.onkeydown() {
        var e = event.srcElement;
        if (event.keyCode == 13) {
            return false;
        }
}

但是这样会出现想要使用回车又不能用的尴尬用提。

2.单独去掉输入框的回车事件的方法

<input type="text"  onkeydown="return ClearSubmit(event)" />
function ClearSubmit(e) {
    if (e.keyCode == 13) {
        return false;
    }
}

这样就不会上面的那种尴尬情况,但是也需要创建一个方法,代码臃肿。

3.增加一个隐藏的输入框

<input id="hiddenText" type="text" style="display:none" />

增加了一个隐藏的输入框之后,表单的文本框不再是唯一的,回车不会触发提交事件。本人喜欢这个。

另外其他表单元素,与文本框单独存在的情况下也可能出现这个问题。如一个表单里只有一个文本框和一个下拉列表此时会发生上述情况。

  • 2
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值