搜索栏获取百度suggestion
标签：
JavaScript
<!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> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>无标题文档</title> <script type="text/javascript" class="lazyload" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsQAAA7EAZUrDhsAAAANSURBVBhXYzh8+PB/AAffA0nNPuCLAAAAAElFTkSuQmCC" data-original="mysuggest.js"></script> <style type="text/css" media="screen"> body { font: 11px arial; } .suggest_link { background-color: #FFFFFF; padding: 2px 6px 2px 6px; } .suggest_link_over { background-color: #E8F2FE; padding: 2px 6px 2px 6px; } #search_suggest { position: absolute; background-color: #FFFFFF; text-align: left; border: 1px solid #000000; } </style> </head> <body> <div style="width: 500px;"> <form id="frmSearch" action=""> <input type="text" id="txtSearch" name="txtSearch" alt="Search Criteria" onkeyup="searchSuggest();" onkeydown="searchSuggest();" autocomplete="off" /> <input type="submit" id="cmdSearch" name="cmdSearch" value="Search" alt="Run Search" /><br /> <div id="search_suggest"> </div> </form> </div> </body> </html>mysuggest.js
window.baidu=new Array(); function searchSuggest() { var head = document.getElementsByTagName("head")[0]; var str = encodeURIComponent(document.getElementById('txtSearch').value); var url = 'http://suggestion.baidu.com/su?wd='+str+'&t='+Math.round(new Date().getTime()/1000); load_script(url,function(){ window.baidu.sug = function(params){ var list = params.s; var ss = document.getElementById('search_suggest') ss.innerHTML = ''; for(i=0; i < list.length - 1; i++) { var suggest = '<div onmouseover="javascript:suggestOver(this);" '; suggest += 'onmouseout="javascript:suggestOut(this);" '; suggest += 'onclick="javascript:setSearch(this.innerHTML);" '; suggest += 'class="suggest_link">' + list[i] + '</div>'; ss.innerHTML += suggest; } }; }); } function load_script(url, callback){ var head = document.getElementsByTagName('head')[0]; var script = document.createElement('script'); script.type = 'text/javascript'; script.src = url; script.onload = script.onreadystatechange = function(){ if((!this.readyState || this.readyState === "loaded" || this.readyState === "complete")){ callback && callback(); script.onload = script.onreadystatechange = null; if ( head && script.parentNode ) { head.removeChild( script ); } } }; head.insertBefore( script, head.firstChild ); } //Mouse over function function suggestOver(div_value) { div_value.className = 'suggest_link_over'; } //Mouse out function function suggestOut(div_value) { div_value.className = 'suggest_link'; } //Click function function setSearch(value) { document.getElementById('txtSearch').value = value; document.getElementById('search_suggest').innerHTML = ''; }
点击查看更多内容
为 TA 点赞
评论
共同学习，写下你的评论
评论加载中...
作者其他优质文章
正在加载中
感谢您的支持，我会继续努力的～
扫码打赏，你说多少就多少
赞赏金额会直接到老师账户
支付方式
打开微信扫一扫，即可进行扫码打赏哦