怪事年年有,今年特別多。
話說,最近項目中遇到一件怪事,當我鼠標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>
總的來說,適合自己的才是好的,遇到問題要仔細分析,跟着感覺走,不要盲目相信經驗。當一個問題花了比較多的時間,就要反思是否思路不對還是方法有誤,要跳出固定思維,抽絲撥繭地去分析所有可能的原因。