ASP.NET页面中用javascript响应文本框的回车事件

最新推荐文章于 2023-07-29 15:56:09 发布

原创最新推荐文章于 2023-07-29 15:56:09 发布 · 143 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #xhtml #c# #ViewUI

本文介绍了一个简单的ASP.NET网页搜索功能实现方式，通过JavaScript监听文本框的回车事件触发搜索，利用C#后端处理搜索请求并跳转到指定页面。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

很多购物网站的搜索功能，都是你在文本框中输入东西后直接回车就跳到搜索页了
下面看看代码：

<%@ 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>