用javascript打造搜索工具欄

2024-09-06 12:41:24

字體：大中小

來源：轉載

供稿：網友

一:最終效果

二:原理

如果你在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)
     {