lycong

          關(guān)于text文本框 按回車鍵 何種情況下 submit-------- 從一個bugfix 問題中想到

                      接到一個問題,大概描述如下:頁面有一text文本框,有一submit類型的按鈕,輸入內(nèi)容后,按回車頁面只是刷新一下,但是沒有執(zhí)行創(chuàng)建操作。而且文件夾名有如下限制:不能和之前創(chuàng)建文件夾同名,且非空。jsp中的內(nèi)容簡化為如下: 

          <form> <tr>
           <td><input type="text" id="filename" /> </td>
          <td><input type="submit" onclick="return addFile();"  id="sub"/> </td>
          </tr> </form>


                  其中addFile()函數(shù)會有上面提及到限制判斷,并且會返回boolean類型,當(dāng)然符合條件時就返回true,不符合就返回false。理所當(dāng)然當(dāng)輸入內(nèi)容后點擊submit按鈕會正常執(zhí)行相關(guān)操作而且會正常執(zhí)行限制判斷。可是奇怪的是,在IE下 在text框輸入內(nèi)容后直接按回車確不能執(zhí)行相關(guān)操作,只是頁面刷新了一下, 但是在FIREFOX下 按回車卻能正常執(zhí)行操作和判斷。 之前第一時間就是想到應(yīng)該在text文本框中加一個onkeydown的事件enter_file(),enter_file函數(shù)是當(dāng)按下回車時就執(zhí)行,并且函數(shù)中應(yīng)該有這句代碼 document.getElementById('sub').click(); 就是說當(dāng)回車時就執(zhí)行submit按鈕的click操作。 貌似應(yīng)該會正常執(zhí)行操作的吧,可是又一奇怪問題出現(xiàn)了,就是在IE下,在文本框中輸入 a 后(假設(shè)之前沒有文件名為a的文件),然后快速按2下(更多下也可以),結(jié)果會跳過“不能創(chuàng)建重復(fù)文件名”的判斷,創(chuàng)建出2個相同名字a 的文件夾,而且例如輸入同名文件名后,彈出框會一閃而過,不會等點擊確認后才退出彈出框,但是在FIREFOX下卻是正常執(zhí)行,也不會出現(xiàn)一閃而過的現(xiàn)象,就是快速按幾下也只是創(chuàng)建一個文件夾a。 之后百思不得其解,試過一些方法,比如把submit類型改為button類型,把onkeydown事件換成onkeypress或者onkeyup ,結(jié)果還是出現(xiàn)IE下快速按回車 創(chuàng)建2個同名文件夾,還是出現(xiàn)一閃而過的現(xiàn)象。
                 初步判斷可能是ie和ff在text框按回車的響應(yīng)不同,最后上網(wǎng)搜了一下,找到一個帖子 名為求解一個關(guān)于回車的問題 http://topic.csdn.net/t/20061128/14/5191186.html ,具體內(nèi)容到那個帖子看看。抽取其中值得注意的地方如下:
             IE:       
            1.   只有一個text框時,(不管有沒有submit),直接觸發(fā)onsubmit   (form標簽的一事件屬性)
            2.   有多個text框時,觸發(fā)submit上的onclick,其默認行為為觸發(fā)onsubmit。  

          相對來說,ff的行為最復(fù)雜。       
            1.   有submit或button時,觸發(fā)submit或button的onclick,然后該onclick的默認行為會觸發(fā)onsubmit。  
            2.   沒有submit或button時,  
            2.1   只有一個text框時,觸發(fā)onsubmit;  
            2.2   有多個text框時,不觸發(fā)onsubmit。  

          因為看到當(dāng)只有一個text框時,直接觸發(fā)onsubmit,就聯(lián)想到要在form標簽中加上onsubmit事件,于是把上面的代碼改為如下:
          <form onsubmit="return addFile()"> <tr>
           <td><input type="text" id="filename" /> </td>
          <td><input type="submit" id="sub"/> </td>
          </tr> </form>
          結(jié)果在IE下終于能成功操作,即是快速按幾下也只是創(chuàng)建一個文件夾,并且不在出現(xiàn)一閃而過的現(xiàn)象。 因此很多時候在IE下可能出現(xiàn)奇怪問題,換作FF下就沒問題了,F(xiàn)irefox支持JavaScript是正宗的。另外用firefox的插件 firedebug 來調(diào)試 javascript 程序 簡直太爽了。




          posted on 2008-05-28 21:03 cong 閱讀(1871) 評論(1)  編輯  收藏 所屬分類: JavaScript

          Feedback

          # re: 關(guān)于text文本框 按回車鍵 何種情況下 submit-------- 從一個bugfix 問題中想到 2008-06-12 00:42 XIN

          GOOD  回復(fù)  更多評論   


          My Links

          Blog Stats

          常用鏈接

          留言簿(1)

          隨筆分類

          隨筆檔案

          搜索

          最新評論

          閱讀排行榜

          評論排行榜

          主站蜘蛛池模板: 丽水市| 武隆县| 永康市| 达孜县| 内黄县| 武乡县| 濮阳县| 南和县| 玉山县| 大新县| 彭水| 故城县| 柘城县| 贺州市| 饶平县| 乃东县| 临夏市| 静宁县| 黄陵县| 翼城县| 木兰县| 邯郸市| 碌曲县| 泾阳县| 开江县| 民县| 武清区| 五原县| 镇安县| 宁明县| 仙居县| 托克逊县| 库车县| 汕尾市| 临泉县| 商洛市| 高邑县| 灵璧县| 隆安县| 东乡| 铜陵市|