首页 > 代码库 > ajax异步服务器获取时间

ajax异步服务器获取时间

1、创建ajax对象

    <script type="text/javascript">        //创建AJAX异步对象        function createAJAX(){            var ajax = null;            try{                //如果IE5=IE12的话                ajax = new ActiveXObject("microsoft.xmlhttp");            }catch(e1){                try{                    //如果是非IE的话                    ajax = new XMLHttpRequest();                }catch(e2){                    alert("你的浏览器中不支持异步对象,请换浏览器");                }            }            return ajax;        }    </script>

2、添加获取时间按钮

当前时间:<span id="time"></span><br/><input id="buttonID" type="button" value="获取当前时间"/><p/>

3、HTML内对ajax返回的数据进行处理

<script type="text/javascript">        document.getElementById("buttonID").onclick = function(){            //NO1)创建AJAX异步对象            var ajax = createAJAX();            //NO2)准备发送请求            var method = "GET";            var url = "${pageContext.request.contextPath}/AjaxTimeServlet?time=" + new Date().getTime();            ajax.open(method,url);            //NO3)真正发送请求体的数据到服务器,如果请求体中无数据的话,就用null表示            ajax.send(null);                        //-------------------------------------------------------------等待                    //NO4)AJAX异步对象不断监听服务器响应的状态0-1-2-3-【4】            //一定要状态变化后,才可触发function(){}函数            //如果状态永远是4-4-4-4-4,是不会触发function(){}函数的            ajax.onreadystatechange = function(){                //如果状态码为4的话                if(ajax.readyState == 4){                    //如果响应码为200的话                    if(ajax.status == 200){                        //NO5)从AJAX异步对象中获取服务器响应的HTML数据                        var nowStr = ajax.responseText;                                                //NO6)将结果按照DOM规则,动态添加到web页面指定的标签中                        var spanElement = document.getElementById("time");                        spanElement.innerHTML = nowStr;                    }                }            }                     }

4、java对ajax的处理

/** * 无需刷新整个Web页面显示服务器响应的当前时间 */public class AjaxTimeServlet extends HttpServlet {    public void doGet(HttpServletRequest request, HttpServletResponse response)throws ServletException, IOException {        SimpleDateFormat sdf = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss");        String nowStr = sdf.format(new Date());                //以流的方式将结果响应到AJAX异步对象中        response.setContentType("text/html;charset=UTF-8");        PrintWriter pw = response.getWriter();        pw.write(nowStr);        pw.flush();        pw.close();    }}

 

ajax异步服务器获取时间