有的时候需要在自己的网站中,添加google等搜索引擎方便用户查询,以下为实现的效果截图及js代码,文章暂不考虑样式美观问题...
<!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>
<title></title>
<script type="text/javascript">
var SearchData = {
"order": ["google", "baidu", "sogou"],
"google": [ { "c": "网页", "u": "http://www.google.com.hk/search?q=##QUERY##" }, { "c": "图片", "u": "http://images.google.com.hk/images?q=##QUERY##" }, { "c": "视频", "u": "http://www.google.com/search?q=##QUERY##&tbs=vid:1" }, { "c": "地图", "u": "http://ditu.google.cn/maps?q=##QUERY##" }, { "c": "MP3", "u": "http://www.google.cn/music/search?q=##QUERY##" }, { "c": "翻译", "u": "http://translate.google.cn/?#en|zh-CN|##QUERY##" } ],
"baidu": [ { "c": "网页", "u": "http://www.baidu.com/s?cl=3&wd=##QUERY##&fr=img1000" }, { "c": "图片", "u": "http://image.baidu.com/i?tn=baiduimage&ct=201326592&cl=2&lm=-1&pv=&word=##QUERY##&z=0" }, { "c": "视频", "u": "http://video.baidu.com/v?word=##QUERY##&ct=301989888&rn=20&pn=0&db=0&s=0&fbl=1024" }, { "c": "地图", "u": "http://map.baidu.com/?q=##QUERY##" }, { "c": "MP3", "u": "http://mp3.baidu.com/m?f=ms&rf=idx&tn=baidump3&ct=134217728&lf=&rn=&word=##QUERY##&lm=-1" }, { "c": "知道", "u": "http://zhidao.baidu.com/q?ct=17&pn=0&tn=ikaslist&rn=10&word=##QUERY##&fr=nwst" } ],
"sogou": [ { "c": "网页", "u": "http://www.sogou.com/web?query=##QUERY##&_asf=www.sogou.com&_ast=1283497171&w=01015002&p=40040100&oq=%B0%AE%C4%E3&ri=0&sourceid=sugg" }, { "c": "图片", "u": "http://pic.sogou.com/pics?query=##QUERY##" }, { "c": "视频", "u": "http://v.sogou.com/v?query=##QUERY##" }, { "c": "地图", "u": "http://map.sogou.com/?p=40031000&kw=##QUERY##" }, { "c": "MP3", "u": "http://mp3.sogou.com/music.so?&class=1&p=40010200&query=##QUERY##" }, { "c": "问答", "u": "http://wenda.sohu.com/?p=40041300&kw=##QUERY##" } ]
};
window.SearchQuery = SearchData['google'][0].u;
window.SearchQuery2 = '';
window.categoryId = 0;
//设置搜索方式
function setQ(query, who, color) {
var anchors = document.getElementById('somenu').getElementsByTagName('a');
for (var i = 0; i < anchors.length; i++) {
anchors[i].style.color = '';
if (anchors[i].innerHTML === who) {
anchors[i].style.color = '' + color;
};
}
window.SearchQuery = query;
document.getElementById('soso_cont').select();
};
function changeSearch(id) {
for (var i = 0; i < document.getElementsByName('radiobutton').length; i++) {
document.getElementsByName('radiobutton')[i].checked = false
};
document.getElementsByName('radiobutton')[id].checked = true;
var x = 'google';
x = window.SearchData["order"][parseInt(id)];
var lhtml = '';
for (var i = 0; i < SearchData[x].length; i++) {
lhtml += '<a href="javascript:setQ(\'' + SearchData[x][i].u + '\',\'' + SearchData[x][i].c + '\', \'#000\');" id="' + x + '_' + i + '">' + SearchData[x][i].c + '</a>';
if (i < SearchData[x].length - 1) lhtml += ' | ';
}
document.getElementById('somenu').innerHTML = lhtml;
setQ(SearchData[x][0].u, SearchData[x][0].c, '#000');
y = '/images/' + x + '.png';
document.getElementById('soso_logo').firstChild.setAttribute('src', y);
};
function doSearch() {
window.SearchQuery2 = SearchQuery.replace('##QUERY##', document.getElementById('soso_cont').value); window.open(SearchQuery2);
};
//设置网站搜索引擎
function changeSearch2(name) {
var searchitems = [['google', '0'], ['baidu', '1'], ['sogou', '2']];
for (var idx = 0; idx < searchitems.length; idx++) {
if (searchitems[idx][0] === name) { changeSearch(searchitems[idx][1]); return; } };
changeSearch('0');
};
//加载执行函数
function addOnloadEvent(fnc) {
if (window.addEventListener) {
window.addEventListener("load", fnc, false);
} else if (window.attachEvent) {
window.attachEvent("onload", fnc);
} else {
var oldOnload = window.onload || function() { };
window.onload = function(e) {
oldOnload(e);
window[fnc](e);
};
}
}
addOnloadEvent(function() {
//重新设置网站搜索引擎
changeSearch2(window.default_search);
});
</script>
</head>
<body>
<div id="top_mid" class="top_mid">
<div class="soso">
<div id="somenu" class="somenu">
网页 | 图片 | 视频 | 地图 | MP3 | 翻译
</div>
<div id="soso_logo" class="soso_logo">
<img src="images/google.png" width="75" height="29" alt="" />
</div>
<div id="soso_body" class="soso_body">
<input id="soso_cont" class="soso_cont" type="text" name="textfield" />
<label><input name="button" type="button" class="soso_button" id="soso_button" onclick="doSearch()" value="搜 索" /> </label>
</div>
<div id="soso_options" class="soso_options">
<label> <input type="radio" name="radiobutton" value="0" checked="checked" onclick="changeSearch(this.value)" /> 谷歌 <input type="radio" name="radiobutton" value="1" onclick="changeSearch(this.value)" /> 百度
<input type="radio" name="radiobutton" value="2" onclick="changeSearch(this.value)" /> 搜狗
</label>
</div>
</div>
</div>
</body>
</html>