来源:http://www.ido321.com/1143.html
看到一些网站上添加了各种搜索引擎。如Google、百度、360、有道等,就有点好奇,这个怎么实现?研究了一各个搜索引擎怎么传送关键字,找到了小窍门,于是乎,自家弄了一个百家搜索:
效果:
演示地址戳此:http://sousuodaquan.sinaapp.com/
ps:在列表中添加了糯米汇(http://www.nuomihui.com)的站内搜索,仅用于演示,别无它用,特此声明。
HTML代码:
<div class="sdiv"> <form id="sform" method="get" target="_blank" action="http://www.baidu.com/s"> <div class="mains"> <ul id="selectul"> <li id="selectedli" style="background-color: white;">百度</li> <li>百度</li> <li>谷歌</li> <li>必应</li> <li>有道</li> <li>搜搜</li> <li>搜狗</li> <li>360</li> <li>爱淘宝</li> <li>亚马逊</li> <li>当当</li> <li>知道</li> <li>维基</li> <li>Crea</li> <li class="lastli">糯米汇</li> </ul> <input type="text" name="wd" id="findParam"/> </div> <input type="submit" value="搜索" id="btn" /> </form> <h4 style="margin-left:100px">出处:<a href="http://www.ido321.com/" target="_blank">淡忘~浅思</a></h4> </div>
window.onload = function() { var selectul = document.getElementById('selectul'); var lis = selectul.getElementsByTagName('li'); var selectedli = document.getElementById('selectedli'); var findParam = document.getElementById('findParam'); var sform = document.getElementById("sform"); var lislen = lis.length; for (var i = 0; i < lislen; i++) { lis[i].onmouSEOver=function() { selectul.style.overflow = "visible"; }; lis[i].onmouseout=function() { selectul.style.overflow = "hidden"; }; lis[i].onclick = function() { selectedli.innerHTML = this.innerHTML; switch(this.innerHTML) { case "百度": findParam.name='wd'; sform.action = "http://www.baidu.com/s"; break; case "谷歌": findParam.name='q'; sform.action = "http://www.google.com.hk/search"; break; case "必应": findParam.name='q'; sform.action = "http://cn.bing.com/search"; break; case "有道": findParam.name='query'; sform.action = "http://www.sogou.com/web"; break; case "搜搜": findParam.name='w'; sform.action = "http://www.soso.com/q"; break; case "搜狗": findParam.name='q'; sform.action = "http://www.youdao.com/search"; break; case "360": findParam.name='q'; sform.action = "http://www.youdao.com/search"; break; case "爱淘宝": findParam.name='key'; sform.action = "http://ai.taobao.com/search/index.htm"; break; case "亚马逊": findParam.name='field-keyWords'; sform.action = "http://www.amazon.cn/s/ref=nb_sb_noss"; break; case "当当": findParam.name='key'; sform.action = "http://search.dangdang.com/"; break; case "知道": findParam.name='word'; sform.action = "http://zhidao.baidu.com/search"; break; case "维基": findParam.name='search'; sform.action = "ttp://zh.wikipedia.org/w/index.php"; break; case "Crea": findParam.name='q'; sform.action = "http://search.creativecommons.org/"; break; case "糯米汇": findParam.name='s'; sform.action = "http://www.nuomihui.com/"; break; } selectul.style.overflow = "hidden"; }; }; };
下一篇:关于坛友的一个布局问题的解答
新闻热点
疑难解答