您的位置：首页 > 其它

ajax邮箱后缀自动补全

2016-09-20 13:02 627 查看

效果图



选中效果



数据我这里用html里面是json字符串 也可以直接请求servlet返回json

["@qq.com","@163.com","@shouhu.com","@yahu.com","@taobao.com"]


JSP代码

<body>
<div class="auto">

<input type="text" name="search" id="mySearch" >
<div class="showValue">

</div></div>


JS代码

<script type="text/javascript">
$(function(){
$("#mySearch").keyup(function(){
var value=$(this).val();//获取当前值

var _this=$(this);

$(".showValue").empty().show();//empty清除之前的数据
$.ajax({
type:"post",
url:"data.html",
success:function(data){

var arr=eval(data);//将字符串转换为数组
for(var i=0; i<arr.length; i++){
$(".showValue").append("<div>"+value+""+arr[i]+"</div>");//append追加搜索到的数据
}
$(".showValue").find("div").click(function (){
_this.val($(this).text());
$(".showValue").hide();//隐藏div
})

}});

});
});

</script>


源码下载 - - - > ajax邮箱自动追加后缀

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航