ajax简单实现

ajax

一．ajax的了解

ajax简单实现

二．简单ajax的实现代码

1.页面层

1.第一种原生态方式(get方式)

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>ajax</title>
    <script type="text/javascript" src="js/jquery-1.12.4.js"></script>
    <script type="text/javascript">

        //首先注册一个事件
        $(function(){
            $("[name=uname]").blur(function () {
              1. //发送ajax请求
                //xhr
                if(window.XMLHttpRequest){//非IE浏览器或版本较高的浏览器
                    xhr=new XMLHttpRequest();
                }else{//是IE的浏览器
                    xhr=new ActiveXObject("Microsoft:XMLHTTP")
                }
               2.//能准备发送的请求的 方式(get,post), 地址，异步请求
                xhr.open("get","/FristServlet?uname="+$("[name=uname]").val(),true);
                //回调函数
                xhr.onreadystatechange=function () {
                    if (xhr.readyState==4 && xhr.status==200){//发送请求成功
                     //获取回来的响应文本
                        var data=xhr.responseText;
                        $("#msg").html(data);

                    }


                };


                xhr.send(null);//如果是get就是null/如果是post不为空
            });
        });
    </script>
<body>
<input name="uname"/><span id="msg"></span>
</body>
</html>