cb是什么呢?是Ajax返回是直接调用的方法，个是百度返回的数据里面会执行方法进行调用，我们不用做任何的处理，只需要写一个方法接受数据就行了
function ShowDiv(strurls)
{
var urls = strurls["s"];
}
{
var urls = strurls["s"];
}
urls 这个就是我们需要的数据，我们一起来看看调用后返回的数据是什么样式的吧。
ShowDiv({q:"博客",p:false,s:["博客中国","博客园","博客大巴","博客网","博客登陆","博客注册","博客搜索","博客群发","博客 新浪","博客群发大师"]});
这就是百度返回的数据，我们只需要s后面的数据就行了，现在应该明白我写var urls = strurls["s"]; 这句的意思了吧。
这个时候大家可以自己试试了。
因为百度只返回的数据，所以我们还要做一个智能提供的框，当然也就可以自己定义样子了。先来看看这个框吧
<div style="display: none; position: absolute;" id="allSitesBoxHdl" class="classlist" onmouseover="this.style.display='block'" onmouseout="this.style.display='none'"> <ul id="allSitesBoxContent">
</ul>
</div>
</ul>
</div>
样式如下
#allSitesBoxHdl.classlist
{
position: absolute;
background-color: #F5FBFF;
width: 256px;
border: 1px solid #C9E4F4;
top: 28px;
left: 0;
text-align: left;
font-size: 14px;
line-height: 30px;
padding: 1px;}#allSitesBoxHdl.classlist li{
display: inline;
}
#allSitesBoxHdl.classlist li.lis a{
text-decoration: none;
height: 30px;
width: 210px;
float: left;
padding-left: 8px;
color: #666;
}
#allSitesBoxHdl.classlist li.lis a:hover
{
color: #016493;
background-color: #edf6fb;
}
#allSitesBoxHdl.classlist li.lis a:active
{ color: #016493;
background-color: #edf6fb;
}
#allSitesBoxHdl.classlist li.lis input
{
cursor: pointer;
color: #FF6600;
border-right: 1px solid #ccc;
border-bottom: 1px solid #ccc;
height: 22px;
margin: 4px;
line-height: 22px;
float: right;
background: #fff;
}
.wena{
color: #666;
font-size: 12px;
height: 30px;
line-height: 30px;
width: 250px;
float: left;
}
{
position: absolute;
background-color: #F5FBFF;
width: 256px;
border: 1px solid #C9E4F4;
top: 28px;
left: 0;
text-align: left;
font-size: 14px;
line-height: 30px;
padding: 1px;}#allSitesBoxHdl.classlist li{
display: inline;
}
#allSitesBoxHdl.classlist li.lis a{
text-decoration: none;
height: 30px;
width: 210px;
float: left;
padding-left: 8px;
color: #666;
}
#allSitesBoxHdl.classlist li.lis a:hover
{
color: #016493;
background-color: #edf6fb;
}
#allSitesBoxHdl.classlist li.lis a:active
{ color: #016493;
background-color: #edf6fb;
}
#allSitesBoxHdl.classlist li.lis input
{
cursor: pointer;
color: #FF6600;
border-right: 1px solid #ccc;
border-bottom: 1px solid #ccc;
height: 22px;
margin: 4px;
line-height: 22px;
float: right;
background: #fff;
}
.wena{
color: #666;
font-size: 12px;
height: 30px;
line-height: 30px;
width: 250px;
float: left;
}
第一步我们需要一个注册事件来完成控件的一些效果事件的绑定，当我们输入数据时才能的效果
方法如下
//注册对象的事件function Init() {
$("#allSitesBoxHdl")[0].style.display = "none";
$(":text").each(function () {
if ($(this)[0].getAttribute('url') == 'true') {//给所有的text加属性
$(this).bind("keyup", OnKeyup); //按键时
$(this).bind("mousedown", BoxShowUrls); //鼠标安下时
$(this).bind("mouseout", BoxHide); //鼠标离开时
$(this).bind("paste", OnPaste); //处理http;//
$(this)[0].setAttribute("autocomplete", "off");
}
});
}
$("#allSitesBoxHdl")[0].style.display = "none";
$(":text").each(function () {
if ($(this)[0].getAttribute('url') == 'true') {//给所有的text加属性
$(this).bind("keyup", OnKeyup); //按键时
$(this).bind("mousedown", BoxShowUrls); //鼠标安下时
$(this).bind("mouseout", BoxHide); //鼠标离开时
$(this).bind("paste", OnPaste); //处理http;//
$(this)[0].setAttribute("autocomplete", "off");
}
});
}
这个方法这句 if ($(this)[0].getAttribute('url') == 'true') {//给所有的url=true属性的Text加效果
的意思是，我们所有引用这个网页的Text框中，只要有一个属性是url='true'的都会实现这个效果，也就是说我们只要把样式和Js文件引入一下，然后想让那具控件显示就直接添加一个属性
url='true'就行了，别的什么也不需要做了。是不是很方便啊。
一起来看看绑定方法的实现吧
