zoukankan      html  css  js  c++  java
  • ASP.NET页面中用javascript响应文本框的回车事件

         很多购物网站的搜索功能,都是你在文本框中输入东西后直接回车就跳到搜索页了,但是在文本框外按回车是不会响应的,自己看了一下他们的代码,像中关村商城的是PHP写的,搜索就是一个form,里面一个textbox一个submit按钮,这样在textbox中按下回车后会自动的提交到form中的action,自己是用ASP.NET写的,一个页面就一个form,自己写了一个响应文本框中回车的东西出来,自己测试过,IE6,8,FIREFOX,CHROME中浏览正常,代码:

    <%@ Page Language="C#" AutoEventWireup="true" CodeFile="test_mulform.aspx.cs" Inherits="test_mulform" %>

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        
    <title></title>

        
    <script type="text/javascript">
            
    function responseEnter(e) {
                
    // 响应回车
                var key = window.event ? e.keyCode : e.which;
                
    if (key == 13) {
                    
    //alert("回车了");
                    search();
                }
            }
            
    function search() {
                
    // 搜索
                var key = document.getElementById("key").value;
                
    if (key.length == 0) {                
                    document.getElementById(
    "key").focus(); //无效
                    alert("请输入搜索关键字!");
                } 
    else {
                    
    var url = "SearchItem.aspx?key=" + encodeURI(key) + "&typeid=0&typename=所有分类";
                    window.open(url);
                }
            }
        
    </script>

    </head>
    <body>
     
    <form id="form1" runat="server" onsubmit="return false;">
        
    <input id="key" type="text" onkeypress="responseEnter(event);" />
        
    <button style="cursor: pointer;" onclick="search();" type="button">
            搜索
        
    </button>
        
    <div><%=DateTime.Now %></div>
     
    </form>
    </body>
    </html>
    撸码:复制、粘贴,拿起键盘就是“干”!!!
  • 相关阅读:
    IIC时序和24C02读写字节时序
    Labview-vi的可重入性
    Labview笔记-创建自定义控件
    非院校科研机构如何查阅下载文献?
    【转】经典的图像去噪算法NLM和BM3D算法
    【转载】计算机科学最重要的32个算法
    图像存储方式
    二维物体形状识别方法比较
    论static关键词
    论引用
  • 原文地址:https://www.cnblogs.com/niunan/p/1759538.html
Copyright © 2011-2022 走看看