小屋創作

日誌2011-11-15 18:22

網頁按enter觸發submit事件

作者:怪鳥

在網頁上,有時候我們會讓特定的<intpu type="text"/>在按下enter後觸發submit事件,但是如果form的action target和原本的不同時,直覺上會寫成

function Search(){
    if(e.keyCode==13){
        document.location.href ="newForm.htm?val=xxx";
    }
}
<intpu type="text" onkeypress="Search()"/>

但是,今天測試發現,事情不是我想的那樣。經過測試,瀏覽器會聰明的替<intpu type="text"/>加上onkeypress後submit的動做。所以不管我如何設定location.href,當javascript執行到location.href時都會先觸發submi動做,取代location.href原本要做的事,造成回到原本action target指向的網頁,無法轉址到newForm.htm。也就是所謂的race condition。

解決辦法就是function要回傳false來停止submit事件。改寫成以下範例

function Search(e){
    e = e || window.event;  
    var keynum = e.keyCode || e.which;
    if(keynum === 13){
        document.location.href ="newForm.htm?val=xxx";
        return false;
    }
}

<intpu type="text" onkeypress="return Search(event)"/>

1

0

LINE 分享

相關創作

最近想把blog的評論系統換成twikoo

【Mineflayer】從零開始寫 Minecraft Bot-Ep.0 Mineflayer 簡介、環境安裝

自動領取 Pixai 每日獎勵

留言

開啟 APP

face基於日前微軟官方表示 Internet Explorer 不再支援新的網路標準,可能無法使用新的應用程式來呈現網站內容,在瀏覽器支援度及網站安全性的雙重考量下,為了讓巴友們有更好的使用體驗,巴哈姆特即將於 2019年9月2日 停止支援 Internet Explorer 瀏覽器的頁面呈現和功能。
屆時建議您使用下述瀏覽器來瀏覽巴哈姆特:
。Google Chrome(推薦)
。Mozilla Firefox
。Microsoft Edge(Windows10以上的作業系統版本才可使用)

face我們了解您不想看到廣告的心情⋯ 若您願意支持巴哈姆特永續經營,請將 gamer.com.tw 加入廣告阻擋工具的白名單中,謝謝 !【教學】