<html>
<head>
<meta?http-equiv="X-UA-Compatible"?content="IE=edge"/>
<title>bing?search</title>
<style?type="text/css">
*{margin:?0;padding:?0}
body{background-color:?#333;}
.bg-div{position:relative;background-image:?url(river.jpg);width:1228px;height:690px;margin:?0?auto;}
.logo{background-image:?url(logo.png);height:53px;width:?107px;?float:?left;margin:?-4px?18px?0?0;}
.search-form{float:?left;?background-color:?#fff;padding:5px;}
.search-text{height:25px;line-height:?25px;float:?left;width:?350px;border:?0;outline:?none;}
.search-button{background-image:?url(search-button.png);width:29px;height:29px;float:?left;border:?0;}
.search-box{position:absolute;top:150px;left:?200px;?}
.suggest{width:?388px;border:?1px?solid?#999;background-color:?#fff;position:?absolute;}
.suggest?ul{list-style:?none;}
.suggest?ul?li{line-height:?25px;padding:?3px;font-size:?14px;cursor:?pointer;}
.suggest?ul?li:hover{background-color:?#e5e5e5;text-decoration:?underline;}
</style>
<script?type="text/javascript"?src="http://libs.baidu.com/jquery/2.1.4/jquery.min.js"></script>
</head>
<body>
?<div?class="bg-div">
? <div?class="search-box">
? <div?class="logo"></div>
<form?class="search-form"?action="https://cn.bing.com/search"?target="_blank"?id="search-form">
<input?type="text"?class="search-text"?name="q"?id="search-input"?/>
<input?type="submit"?class="search-button"?value=""?id="search-button"?/>
</form>
? </div>
?</div>
?<div?class="suggest"?id="search-suggest"?style="display:?none;">
<ul?id="search-result">
<li>hah</li>
<li>hah</li>
<li>hah</li>
<li>hah</li>
<li>hah</li>
<li>hah</li>
</ul>
</div>
<script?type="text/javascript">
//?$("#search-input").on("keyup",function(){
//?var?searchText?=?$("#search-input").val();
//?$.get('http://api.bing.com/qsonhs.aspx?q='+searchText,function(d){
//?var?d=d.AS.Results[0].suggests;
//?var?html='';
//?d.each(function(index,result){
//?html+='<li>'+result.Txt+'</li>';
//?$("#search-result").html(html);
//?$("#search-suggest").show().css({
//?top:$("#search-form").offset().top+$("#search-form").outerHeight(),
//?left:$("#search-form").offset().left
//?})
//?})
//?},"json");
//?})
//?$(document).on("click",function(){
//?$("#search-suggest").hide()
//?})
//?$(document).on("click","li",function(){
//?var?keyword=$(this).text();
//?location.+keyword;
//?})
//獲得id元素
var?getDom=function(id){
return?document.getElementById(id);
}
//給id元素綁定事件
var?addEvent=function(id,event,fn){
var?elem=getDom(id)||document;
if(elem.addEventListener){
elem.addEventListener(event,fn,false);
}else?if(elem.attachEvent){
elem.attachEvent("on"+event,fn);
}else{
elem["on"+event,fn];
}
}
var?getElementLeft=function(elem){
var?actuallf=elem.offsetLeft;
var?parentelem=elem.offsetParent;
while(parentelem!=null){
actuallf+=parentelem.offsetLeft;
parentelem=parentelem.offsetParent;
}
return?actuallf;
}
var?getElementTop=function(elem){
var?actualtp=elem.offsetTop;
var?parentelem=elem.offsetParent;
while(parentelem!=null){
actualtp+=parentelem.offsetTop;
parentelem=parentelem.offsetParent;
}
return?actualtp;
}
//?window.onload=function(){
//?}?
window.onload=function(){
addEvent("search-input","keyup",function(){
getDom("search-suggest").style.top=getElementTop(getDom("search-form"))+38+"px";
getDom("search-suggest").style.left=getElementLeft(getDom("search-form"))+"px";
getDom('search-suggest').style.display?=?'block';
})
}
</script>
</body>
</html>while(parentelem!=null){
actuallf+=parentelem.offsetLeft;
parentelem=parentelem.offsetParent;
}
return?actuallf;
}上面4行什么意思咯 ?actuallf+這是什么意思咯
請(qǐng)教一下 謝謝
qq_12月_0
2017-01-19 01:13:21
