zoukankan      html  css  js  c++  java
  • 【代码保留】怎样添加一个多选搜索引擎

    刚刚明明是在看书的,结果家里来了一群客人JJWW,然后就上线了,然后一个什么都不会但是充满理想和幻想的人正在做着千秋大梦,说是要弄一个很多个搜索引擎的东西(话说几十年前就泛滥了)。……好吧,就友情协助帮忙写一个,现在把代码贴这边!

    效果示意:

    怎么样,着实很土吧?哈哈!

    search_engine_assistant.js文件

     1 function search_engine_assistant() {
     2     this.create = function(items, textbox, button, redirectFunction) {
     3         button.onclick = function() {
     4             var ckitems = document.getElementsByName("__opt");
     5             for (var i = 0; i < ckitems.length; i++) {
     6                 if (ckitems[i].checked) {
     7                     var url = ckitems[i].value.replace(ckitems[i].attributes["key"].nodeValue, textbox.value);
     8                     if(redirectFunction)
     9                         redirectFunction(url);
    10                     break;
    11                 }
    12             }
    13         };
    14         for (var i = 0; i < items.length; i++) {
    15             var item = this.createItem(i, items[i].text, items[i].url, items[i].key, items[i].container, items[i].selected, items[i].selectedCallback);
    16         }
    17 
    18     }
    19 
    20     this.createItem = function(id, text, url, key, container, selected, selectedCallback) {
    21         var selectedCallbackName = "__search_check_" + id;
    22         if (selectedCallback) {
    23             document.write("<script type=\"text/javascript\" language=\"javascript\">\nvar " + selectedCallbackName + " = " + selectedCallback.toLocaleString() + ";\n</script>");
    24         }
    25 
    26         var item = null;
    27         if (container) {
    28             var radio = "<input type=\"radio\" id=\"__opt_id\" name=\"__opt\" value=\"" + url + "\" key=\"" + key + "\" {checked} onclick=\"" + selectedCallbackName + "();\">" + text;
    29             if (selected)
    30                 radio = radio.replace("{checked}""checked");
    31             else
    32                 radio = radio.replace("{checked}""");
    33 
    34             item = new Object();
    35             item.body = radio;
    36             item.key = key;
    37             container.innerHTML += radio;
    38         }
    39         return item;
    40     }
    41 }

    search.html文件:

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    <html>
    <head>
        
    <title>General Search </title>
        
    <style type="text/css">
            .search_panel_css
            
    {
                text-align
    : center;
                margin-top
    : 130px;
            
    }
            .search_logo_css
            
    {
                margin-bottom
    : 40px;
            
    }
            .search_select_css
            
    {
                font-size
    :14px;
                font-family
    :微软雅黑;
                margin-bottom
    : 20px;
            
    }
            .search_text_css
            
    {
                width
    : 300px;
                height
    : 26px;
                font-size
    : 20px;
            
    }
            .search_button_css
            
    {
                font-family
    :微软雅黑;
                margin-top
    : 20px;
                width
    :120px;
                height
    : 26px;
            
    }
        
    </style>
    </head>
    <body>
        
    <div id="searchPanel" class="search_panel_css">
            
    <img alt="" id="search_logo" src="images/example.gif" class="search_logo_css" /><br />
            
    <span id="search_select" class="search_select_css"></span>
            
    <br />
            
    <input id="search_text" type="text" class="search_text_css" />
            
    <input id="search_button" type="button" value="搜    索" class="search_button_css" />
        
    </div>
    </body>

    <script language="javascript" type="text/javascript" src="search_engine_assistant.js"></script>

    <script language="javascript" type="text/javascript">
        
    var sea = new search_engine_assistant();
        sea.create([
            {
                text: 
    "本站",
                url: 
    "http://www.example.com/search/q={0}",
                key: 
    "{0}",
                container: document.getElementById(
    "search_select"),
                selected: 
    true,
                selectedCallback: 
    function() {
                    document.getElementById(
    "search_logo").src = "images/example.gif";
                    document.getElementById(
    "search_button").value = "搜索本站";
                }
            }, {
                text: 
    "百度",
                url: 
    "http://www.baidu.com/s?wd={0}",
                key: 
    "{0}",
                container: document.getElementById(
    "search_select"),
                selected: 
    false,
                selectedCallback: 
    function() {
                    document.getElementById(
    "search_logo").src = "images/baidu.gif";
                    document.getElementById(
    "search_button").value = "百度一下";
                }
            }, {
                text: 
    "谷歌",
                url: 
    "http://www.google.cn/search?hl=zh-CN&q={0}&btnG=Google+%E6%90%9C%E7%B4%A2&meta=&aq=f&oq=",
                key: 
    "{0}",
                container: document.getElementById(
    "search_select"),
                selected: 
    false,
                selectedCallback: 
    function() {
                    document.getElementById(
    "search_logo").src = "images/google.gif";
                    document.getElementById(
    "search_button").value = "谷歌更强大";
                }
            }, {
                text: 
    "搜狗",
                url: 
    "http://www.sogou.com/web?query={0}&_asf=www.sogou.com&_ast=1228659410&w=01019900&p=40040100",
                key: 
    "{0}",
                container: document.getElementById(
    "search_select"),
                selected: 
    false,
                selectedCallback: 
    function() {
                    document.getElementById(
    "search_logo").src = "images/sogou.gif";
                    document.getElementById(
    "search_button").value = "搜狗搜索";
                }
            }, {
                text: 
    "易搜",
                url: 
    "http://www.yisou.com/search:{0}",
                key: 
    "{0}",
                container: document.getElementById(
    "search_select"),
                selected: 
    false,
                selectedCallback: 
    function() {
                    document.getElementById(
    "search_logo").src = "images/yisou.gif";
                    document.getElementById(
    "search_button").value = "一搜就到";
                }
            }, {
                text: 
    "爱问",
                url: 
    "http://iask.sina.com.cn/search_engine/search_knowledge_engine.php?key={0}&classid=0&title=%B0%A2%CB%B9&gjss=0&x=29&y=12",
                key: 
    "{0}",
                container: document.getElementById(
    "search_select"),
                selected: 
    false,
                selectedCallback: 
    function() {
                    document.getElementById(
    "search_logo").src = "images/iask.gif";
                    document.getElementById(
    "search_button").value = "爱问才会赢";
                }
            }

    ],
        document.getElementById(
    "search_text"),
        document.getElementById(
    "search_button"),
        
    function(url) {
            window.open(url);
        });
    </script>

    </html>

    话说别人家做的都不是这样啦,呵呵,好处应该很明显,改动很微妙而且扩展性好,坏处就是代码多了点,还有浏览器要支持脚本。而且放到站点上,最好加一个escape(textbox.value),不过也无所谓了,就拿百度Google来说,就这样都把它们攻残了,还混啥呀!

    继续看书!

  • 相关阅读:
    try-with-resources优先于try-finally
    创建和销毁对象——避免创建不必要的对象
    创建和销毁对象——用私有构造器或者枚举类型强化Singleton属性
    创建和销毁对象——遇到多个构造器参数时考虑使用构建器
    创建和销毁对象——用静态工厂方法代替构造器
    计算机网络物理层——数据通信的基础知识
    多线程——线程交互
    多线程——同步问题
    Percona Monitoring and Management (PMM)
    Docker
  • 原文地址:https://www.cnblogs.com/volnet/p/search_engine_assistant.html
Copyright © 2011-2022 走看看