zoukankan      html  css  js  c++  java
  • 键盘回车事件导致页面刷新的问题

    一个表单下,如果只有一个文本框时,按下回车将会触发表单的提交事件。

    既然是只有一个文本框才会出问题,那么可以加一个隐藏的文本框,如下:

    [html] view plaincopy
     
    1. <input id="hiddenText" type="text" style="display:none" />   

    现在代码成了这样:

     

    [html] view plaincopy
     
    1. <form name="keywordForm" method="post" action="">    
    2. <p id="profile_nav">    
    3. <label for="profile"> 关键字搜索: </label>    
    4. <input style="80; height:20" type="text" name="keyword" onkeypress="searchKeywordKeyboard(event)" />    
    5. <input id="hiddenText" type="text" style="display:none" onkeypress="searchKeywordKeyboard(event)" />  
    6. <input type="button" value="搜索" onClick="searchKeyword()">    
    7. </p>   
    8. </form>  

     

    结论是,可以采取两种方法解决这种问题:1.去掉表单;2.如果非得用表单,只要不让表单里有且只有一个文本框就OK了。

    如果以上的方法还不足以让你去解决问题,那么你可以用以下方法来阻止因为回车而引起的表单自动提交:

    [html] view plaincopy
     
    1. <form name="keywordForm" method="post" action="" onsubmit="return false;">    
    2. <p id="profile_nav">    
    3. <label for="profile"> 关键字搜索: </label>    
    4. <input style="80; height:20" type="text" name="keyword" onkeypress="searchKeywordKeyboard(event)" />    
    5. <input id="hiddenText" type="text" style="display:none" onkeypress="searchKeywordKeyboard(event)" />  
    6. <input type="button" value="搜索" onClick="searchKeyword()">    
    7. </p>   
    8. </form>  

    就是在表单 form 后面加上一个 onsubmit 事件,返回 false,来阻止 form 提交。

  • 相关阅读:
    两个 Gadget 小程序
    Microsoft Visual Studio Team System 2008 中的本地负载测试
    Silverlight 2.0细节
    用后台代码创建Storyboard
    DoubleAnimation方法
    Silverlight Random class is not very random
    微软Silverlight移动版本将于年内推出 支持S60
    yahoo也有了Silverlight Developer Center
    微软证实新版Silverlight将具备离线应用功能
    xaml设计实验
  • 原文地址:https://www.cnblogs.com/panshengqiang/p/3695730.html
Copyright © 2011-2022 走看看