前端开发 搜索框的设计_百度搜索下拉-功能实现【部分】

前端开发 设计一个搜索框|网页设计与前端开发|前端开发者

jsonp百度搜索下拉功能的简单实现,这个代码有很多的问题;

jsonp百度搜索下拉

<!Doctype html>
<html lang=”zh-CN”>
<head>
<metacharset=”UTF-8″>
<title>前端开发 搜索框:下拉功能实现</title>
</head>
<body>
<inputid=”search_input” type=”text” value=”请输入关键词”>
<ulid=”search_result_list”></ul>
<script>
functionsearchResult(json){
varoUl=document.getElementById(‘search_result_list’);
oUl.innerHTML=”;
varres=json.s;
len=res.length;
for (vari=0;i<len;i++) {
varoNewLi=document.createElement(‘li’);
oNewLi.innerHTML=res[i];
oUl.appendChild(oNewLi);
}
}
window.onload = function () {
varoInput=document.getElementById(‘search_input’);
oInput.onfocus=function(){
this.value =”;
};
oInput.onkeyup=function(){
varurl=’https://sp0.baidu.com/5a1Fazu8AA54nxGko9WTAnF6hhy/su?wd=’+this.value +
‘&cb=searchResult’;
varoS=document.createElement(‘script’);
oS.src=url;
document.head.appendChild(oS);
};
};
</script>
</body>
</html>
前端开发只用于网页吗?|web前端开发的项目经验|网站前端开发
» 本文来自:前端开发者 » 《前端开发 搜索框的设计_百度搜索下拉-功能实现【部分】》
» 本文链接地址:https://www.rokub.com/3437.html
» 您也可以订阅本站:https://www.rokub.com
赞(0)
64K

评论 抢沙发

评论前必须登录!