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
j2ee之原生AJAX相关推荐
- 原生ajax XMLHTTPRequest()
原生ajax XMLHTTPRequest() 视频 https://www.bilibili.com/video/BV1WC4y1b78y?p=10 代码 <!DOCTYPE html> ...
- ajax不执行_好程序员Java学习路线分享原生Ajax的使用
好程序员Java学习路线分享原生Ajax的使用,首先我们先来看一下什么是 AJAX AJAX 是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术. AJAX 就是 异步.JavaScript ...
- java原生封装_[Java教程]原生AJAX封装
[Java教程]原生AJAX封装 0 2016-07-12 13:00:08 回归下原生js,网上看到的AJAX封装,遂拿来改改,不知还有何弊端,望指出!1 var ajaxHelper = { 2 ...
- 对原生ajax的理解
$.ajax({url:'',//请求文件路径type:'',//请求方式GET POSTdata:{},//要发给服务器的数据参数dataType:'',//希望接口返回的数据格式json,stri ...
- 原生ajax请求及readyState的几种状态
原生ajax请求写法: var http = new XMLHttpRequest();http.open('get','./package.json');http.onreadystatechang ...
- 原生ajax如何执行,原生ajax调用数据实例讲解
由于jQuery的盛行,现在使用较多的是jQuery封装好了的ajax,因为解决了浏览器兼容性问题,这对程序员来说就等于去掉了一个心头大患,但并非原生ajax就销声匿迹,并且本人感觉还是对原生的aja ...
- .ajax get 写法,原生Ajax写法(GET)
ajax的GET提交方式的原生代码: var xhr = null; if(window.XMLHttpRequest){ xhr = new XMLHttpRequest(); }else if(w ...
- Django学习---原生ajax
Ajax 原生ajax Ajax主要就是使用 [XmlHttpRequest]对象来完成请求的操作,该对象在主流浏览器中均存在(除早起的IE),Ajax首次出现IE5.5中存在(ActiveX控件). ...
- 面试整理(1):原生ajax
接到电话面试,有一些送分题答的不好,在这里整理一下 问题:原生ajax的工作流程是怎么样的? 老用封装好的工具,原生的ajax其实并不熟悉,今天复习一下.主要参考http://www.w3school ...
最新文章
- 在java的程序里date类型比较大小
- (CV方向)精通C++,该如何学?
- ssh登录一段时间后断开的解决方案
- visualSVN下载与安装
- 淘宝API调用 申请 获取session key
- WAF(NGINX)中502和504的区别
- java中的算数运算符号用法与原理分析
- App.config 中读写appSettings、system.serviceModel终结点,以及自定义配置节
- 7-12 文件传输 (25 point(s))
- 第一个Django项目----一小时写出账号密码管理系统
- python开发:开源pytesseract文字识别
- 让电机动起来!Arduino驱动步进电机教程
- 年度网络购物十大被投诉网站淘宝、当当位居前二正文
- 企业级docker仓库Harbor在kubernetes上搭建使用
- GUID分区表的学习
- 在 .NET 应用程序中运行 JavaScript
- 一台笔记本连接WiFi,与一台只有有线网卡的台式机共享Internet的方法
- 简单易懂的理解java开发中的 DO、BO、DTO、VO、AO都是什么✌
- USB2.0协议原文阅读笔记
- mysql中有几种模糊查询?