基础2.通过Ajax获得servlet数据(最基础)
案列一:从服务器的得到输出的数据
Jsp界面
<script type="text/javascript" src="test.js"></script> //引入js中的script语句
<body>
<form action="AjaxServlet"> //这里提交到哪里和下面的和谁连接没啥关系,这里改成AjaxServlet1
<input type="button" value="ok" id="ok"> //下面不变照样能够得到一样结果
</form>
</body>
AjaxServlet界面
public void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
System.out.println("connection succces");
response.getWriter().print("connection ok"); //这里为什么是write因为下面是responseText
}
test.Js界面
/**
* Ajax建立与服务器端的连接 接收服务器的请求 处理服务器返回的数据
* 开发步骤:
* 1.创建XMLHttpRequest对象
* 2.打开和服务器的连接
* 3.发送数据
* 4.接收服务器端的响应
*/
/**
* 1.创建XMLHttpRequest 对象
*/
function createXMLHttpRequest() { //万能模板 var XMLHttpReq; if (window.XMLHttpRequest) { // 是Mozilla浏览器 XMLHttpReq = new XMLHttpRequest();
} else if (window.ActiveXObject()) { // IE浏览器
try {
XMLHttpReq = new ActiveXObject("Msxml2.XMLHTTP"); //因为ie也会出现不兼容所以抛异常
} catch (e) {
XMLHttpReq = new ActiveXObject("Microsoft.XMLHTTP"); //微软的,记住就好
}
}
return XMLHttpReq;
}
//ok按钮点击时触发事件,这里我和之前所想的思维都不一样,因为正常情况window.onload一旦加载下面没有点击onclick,那么该方法不执行,然而后面当你点击按钮时,因为已经加载结束了,按道理来讲就算里面为onclick这个方法也不会执行,因为你在window.onload里面,大方法都没有执行,方法里面的方法是不会执行的,但这里还是触发了时间,这也说明老师说的window.onload除了有加载情况下,还有监听的作用,一点触发事件就会触发该方法,这点要明白,同时如果当你去window.onload=function,这个外层的方法,就算你触发事件也不会有反应,因为 document.getElementById("ok")是要放在方法里,而不是放在外面。
window.onload=function(){ //加载时运行,同时具有监听的作用
document.getElementById("ok").onclick=function(){ //通过按钮触发事件
//1.创建XMLHttpRequest对象
var xmlReq=createXMLHttpRequest();
//2.打开和服务器端的连接
xmlReq.open("GET","AjaxServlet",true);//有GTE和POST方法,中间代表连接路径,true代表异步
//3.发送数据
xmlReq.send(null); //因为采用的是get方法,所以方法为null
//4.接收服务器的响应
xmlReq.onreadystatechange=function(){
if(xmlReq.readyState==4){//判断对象状态是否完成
if(xmlReq.status==200){ //信息已经成功返回
var xmltext =xmlReq.responseText; //得到AjaxServlet往外输出的数据
alert("data-"+xmltext); //输出结果:data-connection ok
}
}
}
}
}
基础2.通过Ajax获得servlet数据(最基础)的更多相关文章
- ajax和servlet交互,表单日历插件,表单验证,form.js
我的index.jsp <body> <a>点我获取数据</a> <table border=1px> <tr> <td>ID& ...
- ajax和servlet交互
网上有比较多的教程来将如何实现ajax与servlet的交互了,这里和这里的教程可以参考参考,在此处我只简单说明一下,并记录一下我这次遇到的问题. 整个思路是:写个js函数,在里面使用XHR(ajax ...
- Jquery+ajax+json+servlet原理和Demo
Jquery+ajax+json+servlet原理和Demo 大致过程: 用户时间点击,触发js,设置$.ajax,开始请求.服务器响应,获取ajax传递的值,然后处理.以JSON格式返回给ajax ...
- {Django基础七之Ajax} 一 Ajax简介 二 Ajax使用 三 Ajax请求设置csrf_token 四 关于json 五 补充一个SweetAlert插件(了解)
Django基础七之Ajax 本节目录 一 Ajax简介 二 Ajax使用 三 Ajax请求设置csrf_token 四 关于json 五 补充一个SweetAlert插件(了解) 一 Ajax简介 ...
- Ajax+Jsp+servlet+json技术的使用
Ajax+Jsp+servlet+json技术的使用 在使用json的时候,记得必须导入如下几个.jar包,最好是手动复制.jar包只lib路径下,否则可能出现异常. commons-beanutil ...
- Django基础七之Ajax
一 Ajax简介 1.简介 AJAX(Asynchronous Javascript And XML)翻译成中文就是“异步的Javascript和XML”.即使用Javascript语言与服务器进行异 ...
- ajax 请求后台数据返回异常 及 提示404方法名不存在
1.正常使用 Ajax 调取后台数据时,提示方法名不存在,Ajax前端正常,方法类bean注入正常,方法注解正常.但参数解析时出现异常. @RequestMapping(value="/ge ...
- ajax 发送json数据时为什么需要设置contentType: "application/json”
1. ajax发送json数据时设置contentType: "application/json”和不设置时到底有什么区别? contentType: "application/j ...
- ajax发送json数据时为什么需要设置contentType: "application/json”
1. ajax发送json数据时设置contentType: "application/json”和不设置时到底有什么区别?contentType: "application/js ...
随机推荐
- CentOS 6.3下Samba服务器的安装与配置方法(图文详解)
这篇文章主要介绍了CentOS 6.3下Samba服务器的安装与配置方法(图文详解),需要的朋友可以参考下 一.简介 Samba是一个能让Linux系统应用Microsoft网络通讯协议的软件, ...
- python中单引号, 双引号,三引号的差异
1. 单引号和双引号用法都是一样的,但是如果字符串里有相同的字符时要使用\进行转义 举例:1) print 'hello'2) print "hello"1和2,结果都是hello ...
- linux du和df
df.du和fdisk这三个常用命令:df用于检查文件系统磁盘占用情况,du检查磁盘空间占用情况,而fdisk用于磁盘分区. du,disk usage,是通过搜索文件来计算每个文件的大小然后累加,d ...
- 【bb平台刷课记】wireshark结合实例学抓包
[bb平台刷课记]wireshark结合实例学抓包 背景:本校形势与政策课程课需要在网上观看视频的方式来修得学分,视频网页自带"播放器不可快进+离开窗口自动暂停+看完一集解锁下一集(即不能同 ...
- 使用KRPano资源分析工具还原全景图片
软件交流群:571171251(软件免费版本在群内提供) krpano技术交流群:551278936(软件免费版本在群内提供) 最新博客地址:blog.turenlong.com 限时下载地址:htt ...
- js识别当前用户设备的几个方法
公司要做一个APP下载页面,里面需要判断是安卓还是苹果访问本页面,最开始想偷懒直接在给IOSAPP返回IOSAPP商店地址,然后Android直接进行访问.但想着毕竟做两个页面不利于后期维护和修改,打 ...
- day5
作业 作业需求: 模拟实现一个ATM + 购物商城程序 额度 15000或自定义 实现购物商城,买东西加入 购物车,调用信用卡接口结账 可以提现,手续费5% 每月22号出账单,每月10号为还款日,过期 ...
- ajax用get刷新页面元素在IE下无效解决~~
总结一下解决办法: 在IE下用Ajax请求某一页面,通常会因为缓存的原因而返回上一次的结果,造成混乱,[即get方式时,获取数据,因发送参数和地址都一致,故IE浏览器会从缓存中取,而不会去请求服务器端 ...
- 记录NS_ASSUME_NONNULL_BEGIN和NS_ASSUME_NONNULL_END。
Nonnull区域设置(Audited Regions) 如果需要每个属性或每个方法都去指定nonnull和nullable,是一件非常繁琐的事.苹果为了减轻我们的工作量,专门提供了两个宏:NS_AS ...
- Runtime解决屏幕旋转问题
前言 大家或许在iOS程序开发中经常遇到屏幕旋转问题,比如说希望指定的页面进行不同的屏幕旋转,但由于系统提供的方法是导航控制器的全局方法,无法随意的达到这种需求.一般的解决方案是继承UINavrgat ...