初学AJAX JSON调用

最近新有一个任务,要求在用户登录的时候,输入用户登录名,同时在其旁边显示出用户的真正名字,如果没有这个名字,则显示该用户不存在,刚开始的时候完全不知道怎么下手,这是一个关于jquery ajax json加上后台struts action的处理,现在在此贴上部分代码,希望对一些跟我一样初学的孩纸有帮助。

js代码:

<sccript src="css/jquery-1.8.3.min.js"></sccript>
<script type="text/javascript">
    
    $("#userid").blur(function(){
        var account = $("#userid").val();
        if(account==""){   //在这里判断,如果输入用户名为空,则不需要进行AJAX处理
            return false;
        }else{
            $.ajax({
                   type:"post", //请求方式
                dataType:"json",
                contentType:"application/x-www-form-urlencoded; charset=utf-8",
                url:"/xx/user_xx.do", //这里是跳转到action中处理
                   data:{ //发送给数据库的数据
                      "userid":account
                   },
                   //请求成功后的回调函数参数
                   success:function(data){
                          //alert(data[0].name);
                        $("#lb").html(data[0].name);  //json的取值方式传回给页面,显示在id为lb的span标签内
                   }
               });
        }
    })

</script>

html代码:

<table border="0" cellpadding="0" cellspacing="0" class="input_wrap">
            <tr>
                <td style="width:60px;" align="right">警 员</td>
                <td align="right"><input  name="userid" id="userid"/></td>
            </tr>
            <tr>
                <td style="width:60px;" align="right">警员名</td>
                <td align="center"><span id="lb" style="color: red;width:100px"></span></td>
            </tr>
            <tr>
                <td style="width:60px;" align="right">密 码</td>
                <td align="right"><input name="password" id="password" type="password"/></td>
            </tr>
            <tr>
                <td id="loginBtnCtn" colspan="2" align="right"></td>
            </tr>
        </table>

action 方法处理:

@AuthorityAnnotation(permission = Permission.NO_SESSION)
    public String xx() {

        String username = extor.getValue("userid");
        UserDto user = service.login(username, extor.getValue("password"));    
        JSONObject json = new JSONObject();
        UserDto ud = service.findByAccount(username);
        String str="[{\"name\":\"<font>没有这个用户</font>\"}]";
        if(ud!=null){
            JSONArray jsonArray = JSONArray.fromObject(ud);
            //System.out.println(jsonArray.toString());
            str=jsonArray.toString();
        }
        printOutText(str);  //这是一个封装的方法,将action中处理出来的json值传回页面ajax,也可以用其他方式实现
        return null;
    }


评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值