1. 程式人生 > >ajax query,後臺和Jsp頁面,使用json互動

ajax query,後臺和Jsp頁面,使用json互動

加粗樣式

public void checkAccount(HttpServletRequest request,HttpServletResponse response) throws IOException {
        String account = request.getParameter("account");
        Staff staff = staffService.getByAccount(account);
        JSONObject jsonObject = null;
        if (null != staff){
            //資料庫已存在該賬號,則返回資訊給ajax
            jsonObject = new JSONObject("{accountFlag:true}");
        }else {
            //資料庫未存在該賬號
            jsonObject = new JSONObject("{accountFlag:false}");
        }
        response.getOutputStream().write(jsonObject.toString().getBytes("utf-8"));
    }
<script type="text/javascript">
    function get() {
        //點選輸入賬號時,觸發ajax事件
        $.ajax({
            url:"checkAccount.do",
            type:"post",
            data:{
                account:$("input[name=account]").val()
            },
            dateType:"json",
            success:function (result) {
                //var flag = result.accountFlag;
                var result = eval("("+result+")");
                var flag = result.accountFlag;
                if (flag == true){
                    document.getElementById("tip").innerHTML="該賬號已被註冊";
                }else if (flag == false) {
                    document.getElementById("tip").innerHTML="該賬號未被註冊";
                }
            }
        });
    }
</script>
						<li class="clearfix">
                            <span class="title">賬號:</span>
                            <div class="li_r">
                                <input class="chang" name="account" type="text" onchange="get()">
                            </div>
                            <span class="tip" id="tip"></span>
                        </li>