来源: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>
JavaScript:
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";
};
};
};
下一篇:关于坛友的一个布局问题的解答
百家搜索:在网站中添加Google、百度等搜索引擎的更多相关文章
-
在网站中添加 https 百度分享
博客地址:http://www.moonxy.com 一.前言 百度分享是一个提供网页地址收藏.分享及发送的 WEB2.0 按钮工具,借助百度分享按钮,网站的浏览者可以方便的分享内容到人人网.开心网. ...
-
百家搜索:在站点中加入Google、百度等搜索引擎
来源:http://www.ido321.com/1143.html 看到一些站点上加入了各种搜索引擎. 如Google.百度.360.有道等.就有点好奇.这个怎么实现?研究了一各个搜索引擎怎么传送k ...
-
【前端】向blog或网站中添加语法高亮显示代码方法总结
向blog或网站中添加语法高亮显示的代码方法总结 文章目录 预备知识 目标 第一类方法:嵌入 第二类方法:外部引用 第三类方法:忽略HTML和PHP 最近在写代码时遇到一个问题,就是如何让代码像在ID ...
-
TogetherJS – 酷!在网站中添加在线实时协作功能
TogetherJS是一个免费.开源的 JavaScript 库,来自 Mozilla 实验室,可以实现基于 Web 的在线协作功能.把 TogetherJS 添加到您的网站中,您的用户可以在实时的互 ...
-
在网页中添加google搜索
网页中插入谷歌搜索,至于怎么上谷歌,后面有时间会更,推荐百度 <form method="GET" action="http://www.google.com.hk ...
-
Wordpress网站中添加百度统计代码
百度统计是流量分析平台,帮助收集网站访问数据,提供流量趋势.来源分析.转化跟踪.页面热力图.访问流等多种统计分析服务,同时与百度搜索.百度推广.云服务无缝结合,为网站的精细化运营决策提供数据支持,进而 ...
-
使用::befor和::after伪元素在网站中添加图标
css3为了区分伪类和伪元素,伪元素采用双冒号写法. 常见伪类——:hover,:link,:active,:target,:not(),:focus. 常见伪元素——::first-letter,: ...
-
spring中添加google的guava缓存(demo)
1.pom文件中配置 <dependencies> <dependency> <groupId>org.springframework</groupId> ...
-
bootstrap设计网站中添加代码高亮插件
这款插件的名字叫做google-code-prettify 使用该插件之前的效果: 使用插件之后的效果: 接下来说步骤: (1)下载两个文件 http://codecloud.sinaapp.com/ ...
随机推荐
-
Android常用库
原文链接:http://www.jianshu.com/p/19368c2cdcaf 系统框架 1. 网络请求 Android Async HTTP Android异步HTTP库 AndroidAsy ...
-
Mac OS 下 eclipse中文乱码解决方法(eclipse for mac 中文乱码)
由于一些java源码是从其他人那里拷贝过来,放入Mac os 版本的eclipse下,发现中文都是乱码.经过小试,可以解决. 1.打开eclipse 偏好设置 2.General ——>Cont ...
-
ACM Coin Test
Coin Test 时间限制:3000 ms | 内存限制:65535 KB 难度:1 描述 As is known to all,if you throw a coin up and let ...
-
iOS-appStore发布流程
appStore上传苹果应用程序软件发布流程http://blog.sina.com.cn/s/blog_68661bd801019uzd.html
-
linux下的inode记录
我们经常在Linux下可以看到inode,都不知道是什么东东,那么我们现在来慢慢了解下. 一.inode是什么? 理解inode,要从文件储存说起. 文件储存在硬盘上,硬盘的最小存储单位叫做&q ...
-
windows phone 7 中怎样定义和使用资源(Resource)
1. 系统资源. 在wp7开发中可以看到很多使用系统资源(resource)的例子,例如默认的新page: http://blog.csdn.net/matrixcl/article/details/ ...
-
springday04-go2
练习:计算一个人的bmi指数.算法如下: 身高 单位是米 比如1.70 体重 单位是公斤 比如90 bmi指数 = 体重/身高/身高 如果bmi>24过重,否则正常.视图需要两个,一个是bmi_ ...
-
C#模糊查询绑定datagridview
private CollectionViewSource wgdData = new CollectionViewSource(); private DataTable Ds_wgd { get { ...
-
详解Android ActionBar之二:ActionBar添加Tabs标签和下拉导航
本节主要讲解ActionBar如何添加Tabs标签和下拉导航. 一.添加标签 Tabs 在ActionBar中实现标签页可以实现android.app.ActionBar.TabListener ,重 ...
-
两句话帮你彻底记住gdb之eXamining memory
对于刚学习Unix/Linux环境C编程的小朋友们或者写了很多所谓的C代码的老手们(其实很可能是机械程序员或者是伪程序员)来说,要记住gdb的eXaming memory的语法其实是相当不容易的,如果 ...