利用AJAX实现输入框自动联想

最新推荐文章于 2023-04-10 19:54:45 发布

原创

最新推荐文章于 2023-04-10 19:54:45 发布 · 2.7k 阅读

10 ·

CC 4.0 BY-SA版权

文章标签：

#AJAX #JAVAEE #servlet

在使用其他网页时，经常会看到有输入框的自动联想，在我这个项目中也需要这个功能。

闲话少说，直入主题，基于JAVAEE，用AJAX来实现这个功能。

先看下效果图，

在输入框输入一个字符会自动将含有这个字符的信息全部显示在下方。

下面我们看下代码：

首先是前端页面的js脚本

 $("input[name=uname]").keyup(function(){

首先我们利用键盘松开这里事件来触发我们的javascript方法，这样在我们输入一个字符后将会自动进行整个联想以及显示，更加的人性化。

 var uname = $(this).val();
            if(uname != ""){
                $.ajax({
                    url:"ScoreDetails.servlet",
                    type:"post",
                    data:{"uname":uname},
                    dataType:"html",
                    async:true,
                    success:function(result){
                        $("#lns").show();
                        $("#lns").html(result);