脚本之家 服务器常用软件
快捷导航
您的位置：首页 → 网络编程 → ASP.NET → 实用技巧 →

用javascript打造搜索工具栏

 更新时间：2006年09月25日 00:00:00   作者：  

一:最终效果

二:原理

如果你在Yahoo中搜索“中国”，那么在浏览器的地址栏将得到这样一串地址：http://search.cn.yahoo.com/search?ei=gbk&fr=fp-tab-web-ycn&meta=vl%
3Dlang_zh-CN%26vl%3Dlang_zh-TW&pid=ysearch&source=ysearch_www_hp_button
&p=%D6%D0%B9%FA&Submit=
看上去有些乱了，简化一下：http://search.cn.yahoo.com/search?&p=%D6%D0%B9%FA
这就是关键.其中&p=%D6%D0%B9%FA是搜索的关键字参数，而%D6%D0%B9%FA是“中国”的
Url编码。OK，我们只要能构造出这样的编码就好了。

三：URL编码
JavaScript的encodeURIComponent()函数可以完成编码工作。
比如上面的例子我们可以用“http://search.cn.yahoo.com/search?&p=”＋encodeURIComponent(“中国”)；来完成。

四：代码
(点击加号展开）

复制代码 代码如下:

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

 <!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>Search</title>
 <script language="javascript" type="text/javascript">
 // <!CDATA[

 function GetEncodeOfKey()
 {
     var strKey = window.document.getElementById("Text_Key").value;      
     return  encodeURIComponent(strKey); 
 }

 function GetUrl(site)
 {
     var encode=GetEncodeOfKey();

     //web
     if(document.getElementById("RadioButtonList_Kind_0").checked)
     {
         if(site=="google")
         {
             return "http://www.google.com/search?q="+encode+"&ei=UTF-8";
         }
         else
         {
             return "http://search.yahoo.com/search?p="+encode+"&ei=UTF-8";
         }
     }
     //mp3
     else if(document.getElementById("RadioButtonList_Kind_1").checked)
     {
         if(site=="google")
         {
             return "http://www.google.com/search?q="+encode+" mp3"+"&ei=UTF-8";
         }
         else
         {
             return "http://audio.search.yahoo.com/search/audio?&p="+encode+"&ei=UTF-8";

         }
     }
     //img
     else if(document.getElementById("RadioButtonList_Kind_2").checked)
     {
         if(site=="google")
         {
             return "http://images.google.com/images?q="+encode+"&ei=UTF-8";
         }
         else
         {
             return "http://images.search.yahoo.com/search/images?p="+encode+"&ei=UTF-8";
         }
     }
     else
     {
         //alert("err");
     }

     
 }

 function Button_Google_onclick() 
 {
     window.open(GetUrl("google"));
 }

 function Button_Yahoo_onclick() 
 {
     window.open(GetUrl("yahoo"));
 }

 // ]]>
 </script>
 </head>
 <body>
     <form id="form1" runat="server">
     <div>
         <br />
         <br />
         <strong><span style="font-size: 24pt; color: #336633">Search<br />
         </span></strong>
     </div>
     <hr style="position: relative" />
         <br />
         <table style="left: 0px; position: relative; top: 0px">
             <tr>
                 <td style="width: 31px; height: 21px">
                     <span style="font-family: Terminal">Key</span></td>
                 <td style="width: 253px; height: 21px">
                     <input id="Text_Key" style="width: 248px; position: relative" type="text" /></td>
                 <td style="width: 175px; height: 21px">
                     <asp:RadioButtonList ID="RadioButtonList_Kind" runat="server" RepeatDirection="Horizontal"
                         Style="position: relative" Font-Names="terminal">
                         <asp:ListItem Selected="True">Web</asp:ListItem>
                         <asp:ListItem>Mp3</asp:ListItem>
                         <asp:ListItem>Image</asp:ListItem>
                     </asp:RadioButtonList></td>
             </tr>
             <tr>
                 <td style="width: 31px">
                 </td>
                 <td colspan="2">
                     <input id="Button_Google" style="width: 80px; position: relative" type="button" value="Google" onclick="return Button_Google_onclick()" />
                     &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
                     <input id="Button_Yahoo" style="left: -29px; width: 104px; position: relative" type="button"
                         value="Yahoo!" onclick="return Button_Yahoo_onclick()" /></td>
         </table>
         <br />
         <hr style="position: relative" />
         <asp:HyperLink ID="HyperLink_Home" runat="server" NavigateUrl="~/Default.aspx" Style="position: relative">Home</asp:HyperLink></form>
 </body>
 </html>

 

相关文章

  • 基于ASP.NET实现单点登录(SSO)的示例代码

    基于ASP.NET实现单点登录(SSO)的示例代码

    SSO英文全称Single Sign On（单点登录）。SSO是在多个应用系统中，用户只需要登录一次就可以访问所有相互信任的应用系统。本文为大家分享了基于ASP.NET实现单点登录(SSO)的示例代码，需要的可以参考一下
    2022-05-05
  • 分享Visual Studio原生开发的10个调试技巧（2）

    分享Visual Studio原生开发的10个调试技巧（2）

    这篇文章又为大家分享了Visual Studio原生开发的10个调试技巧，感兴趣的朋友可以参考一下
    2015-11-11
  • ASP.NET 数据访问类

    ASP.NET 数据访问类

    ASP.NET 数据访问类...
    2006-08-08
  • ASP.NET MVC使用异步Action的方法

    ASP.NET MVC使用异步Action的方法

    这篇文章介绍了ASP.NET MVC使用异步Action的方法，文中通过示例代码介绍的非常详细。对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下
    2022-10-10
  • ASP.NET缓存 方法和最佳实践

    ASP.NET缓存 方法和最佳实践

    在 ASP.NET 提供的许多特性中，缓存支持无疑是我最欣赏的特性，我这样说当然是有充分理由的。
    2010-06-06
  • 如何将asp.net core程序部署到Linux服务器

    如何将asp.net core程序部署到Linux服务器

    这篇文章主要介绍了将asp.net core程序部署到Linux服务器上的详细过程,本文给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下
    2022-09-09
  • visual studio 2017企业版本安装（附序列号）

    visual studio 2017企业版本安装（附序列号）

    这篇文章主要介绍了visual studio 2017企业版本安装，文末为大家分享了序列号，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
    2017-03-03
  • 浅析DataBinder.Eval和Eval的区别

    浅析DataBinder.Eval和Eval的区别

    缩短的Eval语法与DataBinder.Eval的不同点在于，Eval会根据最近的容器对象（例如DataListItem）的DataItem属性来自动地解析字段，而DataBinder.Eval需要使用参数来指定容器
    2013-08-08
  • 微信抢红包ASP.NET代码轻松实现

    微信抢红包ASP.NET代码轻松实现

    这篇文章主要为大家相许介绍了轻松实现微信抢红包的ASP.NET代码，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
    2016-08-08
  • 如何禁止文本框的记忆功能方法集锦

    如何禁止文本框的记忆功能方法集锦

    IE提供了一个自动完成功能可以记忆我们的输入内容(如帐号等),方便下一次快速地录入类似资料.这确实是一个非常友好的功能, 在操作时只需用鼠标双击文本框或输入前几个字符, 系统会自动列出以前的录入历史供你选择, 大大提高录入速度及准确性.
    2014-06-06

最新评论