zoukankan      html  css  js  c++  java
  • 按Enter键后Form表单自动提交的问题

      怪事年年有,今年特别多。

      话说,最近项目中遇到一件怪事,当我鼠标focus在文本框中,轻轻敲了下回车键,尼玛页面突然刷新了,当时把宝宝给吓得。

      接下来就是一番苦逼的烧脑和蛋疼~

    一、被表象所迷惑

      突然出现这种情况,脑海中第一反应是,keydown事件是不是出问题了,然后找啊找啊找啊,然后没有然后。

      在把input元素上的所有事件移除掉后,我自信的按了一下enter键。艾玛,又刷新了。心里那个苦哎。

    二、列出所有可能

      一阵捣鼓之后,脑海中列出了所有按下enter键后的改变,url改变,多了一个问号和参数,页面刷新。心中顿时有个想法,然后确定了一下input元素在form中。这是大致可以得出原因应该是按下enter键后,表单提交了。尼玛,这是什么鬼。

    三、水落石出 开心o(* ̄▽ ̄*)ブ

      找到原因后,有不知道为什么。这时候只能搬出度娘了,结果得出当表单中只有一个input输入元素时,点击enter键,form表单会自动提交

    四、结论

      其实知道原因解决起来还是很简单的,比如多加一个input元素设置display:none,利用事件阻止表单提交等等。下面是列出我的solution

    1 <form onsubmit="return false">
    2     <input type="text" name="test"/>
    3 </form>

      总的来说,适合自己的才是好的,遇到问题要仔细分析,跟着感觉走,不要盲目相信经验。当一个问题花了比较多的时间,就要反思是否思路不对还是方法有误,要跳出固定思维,抽丝拨茧地去分析所有可能的原因。

  • 相关阅读:
    VMware三个版本workstation、server、esxi的区别
    vmwarevsphere与vmwareworkstation的区别
    PubMed、MEDLINE和PMC
    1000个并发线程,10台机器,每台机器4核,设计线程池大小(转)
    Internet与Intranet
    VMware安装操作系统鼠标失灵
    超详细SQL SERVER 2016跨网段和局域网发布订阅配置图解和常见问题
    一篇理解什么是CanSet, CanAddr?
    collection v1.3.1升级全记录
    我写的诗
  • 原文地址:https://www.cnblogs.com/MonkeyKingK/p/5232681.html
Copyright © 2011-2022 走看看