Ajax实现的异步传输与验证示例代码
Ajax异步传输用得很广,就拿web开发来说吧,当用户注册时,当用户刚一输完,怎么立即判断用户是否存在,并在输入框后显示提示?这就用到了异步传输~~
它可以让你不离开页面的情况下,获取后台你想要的数据,并显示在当前页面!!好的,下面看个例子
下面是一段Ajax验证代码
在jsp页面中是这样调用js函数的
Ajax获取的数据将在下列标记中显示出来
好的,我们来看一下servlet中的代码:
以上已经很清楚啦,当然验证用户是否存在,道理和这个是一模一样的,其中一定要注意汉字传输中乱码的问题~~~~~~
它可以让你不离开页面的情况下,获取后台你想要的数据,并显示在当前页面!!好的,下面看个例子
下面是一段Ajax验证代码
代码如下:
<script type="text/javascript"> //① 设置变量 var xmlHttp ; var flag = false ; var package_name; //② 创建XMLHttp对象 function createXMLHttp(){ if(window.XMLHttpRequest){ xmlHttp = new XMLHttpRequest() ; } else { xmlHttp = new ActiveXObject("Microsoft.XMLHTTP") ; } } //③ function getPackage_name(package_name){ //创建XMLHttpRequest对象 createXMLHttp() ; document.getElementById("msg").innerHTML=package_name; //创建一个HTTP请求,以post方式将package_name交给AppInfoServlet xmlHttp.open("post","AppInfoOneServlet?package_name="+package_name) ; //调用回调函数 生成可视化的页面响应 xmlHttp.onreadystatechange =checkCallback; // 发送请求 xmlHttp.send(null) ; //友好提示 document.getElementById("msg").innerHTML = "正在获取信息,请耐心等候..." ; } //④ 回调函数 function checkCallback(){ if(xmlHttp.readyState == 4){ if(xmlHttp.status == 200){ var text = xmlHttp.responseText ; var t=text.split('|');//当获取的是多个值,并用"|"作为分割时 document.getElementById("msg").innerHTML =t[0]+ "<br>"+"<div id='container'>"+"<div id='content'>"+"<div id='slider'>"+"<ul>"+"<li>"+"<img src='"+t[1]+"' alt='Css Template Preview' />"+"</li>"+"<li>"+"<img src='"+t[2]+"' alt='Css Template Preview' />"+"</li>"+"</ul>"+"</div>"+"<h3>Android应用截图展示</h3>"+"</div>"+"</div>"+"<center><a href='"+t[3]+"' target='_blank'><img src='./images/downloadsoruce.png'></a></center>" ; //获取的数据在id为“msg” 的标记中显示出来,例如:<span id="msg"></span> } } } </script>
在jsp页面中是这样调用js函数的
代码如下:
<a href="#bottom" onclick="getPackage_name('<%=ainfo.getPackage_name() %>')">获取</a>
Ajax获取的数据将在下列标记中显示出来
代码如下:
<span id="msg"></span>
好的,我们来看一下servlet中的代码:
代码如下:
public void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { request.setCharacterEncoding("utf-8"); response.setCharacterEncoding("utf-8");//必须在out前,否则传输的汉子为乱码啊 PrintWriter out = response.getWriter(); String package_name=request.getParameter("package_name"); AppDaoImpl adi=new AppDaoImpl(); AppInfo ainfo=new AppInfo(); ainfo=adi.getOneAppInfo(package_name); out.print(ainfo.getDescription()+"|"+ainfo.getScreen_1_path()+"|"+ainfo.getScreen_2_path()+"|"+ainfo.getDownload_path()); }
以上已经很清楚啦,当然验证用户是否存在,道理和这个是一模一样的,其中一定要注意汉字传输中乱码的问题~~~~~~
相关推荐
坚持着执着 2020-07-16
坚持着执着 2020-06-14
kentrl 2020-11-10
结束数据方法的参数,该如何定义?-- 集合为自定义实体类中的结合属性,有几个实体类,改变下标就行了。<input id="add" type="button" value="新增visitor&quo
ajaxyan 2020-11-09
zndy0 2020-11-03
学留痕 2020-09-20
Richardxx 2020-11-09
learningever 2020-09-19
chongxiaocheng 2020-08-16
ajaxhe 2020-08-16
lyqdanang 2020-08-16
curiousL 2020-08-03
TONIYH 2020-07-22
时光如瑾雨微凉 2020-07-19
83510998 2020-07-18
jiaguoquan00 2020-07-07
李永毅 2020-07-05