j2ee之原生AJAX

Ajax.js ajax是通过流的方式处理页面请求

var createAjax = function(){var ajax = null;try{ajax = new ActiveXObject("microsoft.xmlhttp");}catch(e1){try{ajax = new XMLHttpRequest();}catch(e2){alert("请换掉你的浏览器");}}return ajax; } 　　　　　/* 判断用户名 */document.getElementById("username").onblur = function(){var username = this.value;var span = document.getElementById("myspan");if(username.length==0){span.innerHTML="用户名不能为空";}else{var ajax = createAjax();var method = "POST";var url="${pageContext.request.contextPath }/AjaxServlet?time="+new Date().getTime();ajax.open(method,url);/* 设置请求头，ajax默认是get提交方式 */ajax.setRequestHeader("content-type","application/x-www-form-urlencoded");username= encodeURI(username);
　　　　　　　　　 /*请求参数*/var content = "username=" + username;ajax.send(content);/* ---------------------------- */ ajax.onreadystatechange = function(){if(ajax.readyState==4 && ajax.status == 200){var valueSrc = ajax.responseText;var img = document.createElement("img");img.src = valueSrc;img.style.width="12px";img.style.height="12px";span.innerHTML="";span.appendChild(img);} }}}

在servlet中的处理

String username = request.getParameter("username");username = new String(username.getBytes("ISO-8859-1"), "utf-8");System.out.println(username);if ("ss".equals(username)) {response.getWriter().write("image/MsgError.gif");} else {if (username.length() > 0) {response.getWriter().write("image/MsgSent.gif");}}

 步骤详情

<h1>Ajax实例</h1><div id="myAjax">ajax将要获取的内容</div><button id="myBtn" onclick="btnClick()">获取内容</button><script type="text/javascript">function btnClick(){//获取ajaxvar ajax = createAjax();//ajax的请求方式var method = "POST";//ajax向服务器（action）发送请求var url = "${pageContext.request.contextPath }/ajaxActiont_start.action?time="+ new Date().getTime();//ajax拼接字符串，准备请求，请求方式+请求地址ajax.open(method, url);/* 设置请求头，ajax默认是get提交方式 *///前一个参数文本内容，后一个参数文本内容字符集，基本上是会自动给你转换为utf-8ajax.setRequestHeader("content-type","application/x-www-form-urlencoded");//这里实际上是把表单中数据转为utf-8的一种方法//username = encodeURI(username);/*请求参数*///这里的参数就是类似于键值对的方式提交，准确的说就是.properties文件中的键值对所以是如下形式传参数var content = "username=" + "1";//发送请求ajax.send(content);/* ---------------------------- *///当请求状态改变的时候ajax.onreadystatechange = function(){//动态状态码为4并且浏览器状态为200的时候if(ajax.readyState==4 && ajax.status == 200){//获取返回的文本流数据var value = ajax.responseText;//获取到指定divvar text = document.getElementById("myAjax");//给指定div中插入数据text.innerHTML = value;} }}</script>

 jQuery中ajax应用

　　　　　　　　　　　　　　　　　　　　　　　　　　　　$.ajax({type : "POST",url : "${pageContext.request.contextPath}/suspicious/suspectParty?time="+ new Date().getTime(),data : {partyid : $pno},success : function(data) {//alert(data.rst.id);var ccd = '';if (data.rst.partyClassCd == 'C') {ccd = '对公当事人';}if (data.rst.partyClassCd == 'I') {ccd = '个人当事人';}$("#ptytb").append("<tr id='ptytr'><td>"+ "<input id='rdo' type='radio' οnclick='rdocl()'/>"+ "</td>"+ "<td>"+ data.rst.partyId+ "</td>"+ "<td>"+ data.rst.partyChnName+ "</td>"+ "<td>"+ data.rst.cardNo+ "</td>"+ "<td>"+ "36"+ "</td>"+ "<td>"+ ccd+ "</td></tr>");}});});

 

转载于:https://www.cnblogs.com/ShaoXin/p/7411427.html

超强干货来袭 云风专访：近40年码龄，通宵达旦的技术人生

总结

以上是生活随笔为你收集整理的j2ee之原生AJAX的全部内容，希望文章能够帮你解决所遇到的问题。

如果觉得生活随笔网站内容还不错，欢迎将生活随笔推荐给好友。