jQuery UI插件实现百度提词器效果
本文实例为大家分享了jQuery自动文字提示功能，供大家参考，具体内容如下
需要在项目中实现动态添加，删除输入框，每个框里面都要有文字提示。
js部分：
//自动完提示
functiontip(obj){
$(obj).autocomplete({
minLength:0,
source:function(request,response){
//alert('dsada');
vartitle=$('#test1').val();
$.ajax({
url:"HotList.php?act=title",
type:'get',
dataType:"json",
data:request,
success:function(dataObj){
//request对象只有一个term属性，对应用户输入的文本
//response是一个函数，在你自行处理并获取数据后，将JSON数据交给该函数处理，以便于autocomplete根据数据显示列表
//自行处理并获取数据...
//vardataObj=data;//表示处理后的JSON数据
response(dataObj);//最后将数据交给autocomplete去展示
},
error:function(XMLHttpRequest,textStatus,errorThrown){
//alert('获取信息失败');
//alert(XMLHttpRequest.status);
//alert(XMLHttpRequest.readyState);
//alert(textStatus);
}
});
},
focus:function(event,ui){
$(obj).val(ui.item.title);
returnfalse;
},
select:function(event,ui){
//$("#project").val(ui.item.title);
//$("#project-id").val(ui.item.id);
$(obj).val(ui.item.title);
$(obj).prev().val(ui.item.id);
returnfalse;
}
})
.data("ui-autocomplete")._renderItem=function(ul,item){
return$("<li>")
.append("<a>"+item.id+"<br>"+item.title+"</a>")
.appendTo(ul);
};
}
html：
<divclass="control-group">
<labelclass="control-label">*相关推荐</label>
<divclass="controls">
<?phpforeach($listOne['recommend_title']as$k=>$v){?>
<div>
<inputtype="hidden"name="tuijian_id[]"value="<?phpecho$listOne['title_id'][$k];?>"/>
<inputtype="text"name="tuijian[]"class="show_goods"onkeyup="tip(this)"value="<?phpecho$v;?>"/><spanclass="btn"onclick="del(this);">删除</span>
</div>
<?}?>
<pid="project-description"></p>
<spanclass="btn"id="add"onclick="add(this);">添加</span>
<script>
//添加推荐节点
functionadd(obj){
varstr="<div><inputtype='hidden'name='tuijian_id[]'/><inputtype='text'class='show_goods'name='tuijian[]'onkeyup='tip(this)'/><spanclass='btn'onclick='del(this);'>删除</span></div>";
$(obj).before(str);
}
//删除当前推荐节点
functiondel(obj){
if($(".show_goods").length<=3){
alert('最少需要三个推荐标题');
returnfalse;
}else{
$(obj).parent().remove();
$(obj).prev().prev().remove();
$(obj).prev().remove();
$(obj).remove();
}
}
</script>
</div>
</div>
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持毛票票。