在学习SpringMVC的过程中,接触到ajax,顺便复习一下前面学习到的知识!

这篇博客中讲的比较详细 http://www.cnblogs.com/lsnproj/archive/2012/02/07/2340395.html  大家可以参考,我就写一些他没讲到的

一.一个基本例子  无刷新添加数据

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>
<script type="text/javascript">
function onClickAjax()
{
var xmlHttp;
//分浏览器创建xmlHttp对象
if(window.XMLHttpRequest)
{
xmlHttp=new XMLHttpRequest();
}
else if(window.ActiveXObject)
{
xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
} //设置请求类型
xmlHttp.open("POST","/ajaxTest/user/ajaxTest/",true); //回调函数
xmlHttp.onreadystatechange=function()
{
// alert(xmlHttp.readyState);
if(xmlHttp.readyState==4)
{
if(xmlHttp.status==200)
{
var data=xmlHttp.responseText;
document.getElementById('div1').innerHTML=data;
alert(data); } else
alert(xmlHttp.status);
} }
xmlHttp.send(); } function test(){alert(" no problem");}
</script>
</head>
<body>
<form>
<input onclick="test()" type="button" value="test"/>
<input onclick="onClickAjax()" type="button" value="submit"/>
<div id="div1"> </div>
</form>
</body>
</html>

后台代码

	@RequestMapping("/ajaxTest")
public String ajaxTest(HttpServletRequest request,HttpServletResponse response)
{
String temp=(String)request.getAttribute("msg");
System.out.println(temp); try {
/*放回json类型的数据
* response.setContentType("application/json");
* String str="{\"age\":\"12\"}";
*/
StringBuilder sb=new StringBuilder();
sb.append("<ul>");
sb.append("<li>jackvin");
sb.append("</li>");
sb.append("<li>tom");
sb.append("</li>");
sb.append("</ul>");
String str=sb.toString();
response.getWriter().write(str);
response.getWriter().close();
} catch (IOException e) {
// TODO Auto-generated catch block
e.printStackTrace();
} return "/showView"; //ajaxTest
}

spring配置我就不贴了,结果是我们看到在原先没有任何数据的页面上,会多出两行数据,这就是ajax的无刷新功能,我们可以用它来添加评论等等

二.很多时候我们需要通过ajax传递json数据 ,那该怎么办呢?

ajax 测试的更多相关文章

  1. selenium通过WebDriverWait实现ajax测试

    selenium通过WebDriverWait实现ajax测试 AndroidDriver driver = new AndroidDriver(); driver.get("http:// ...

  2. selenium经过WebDriverWait实现ajax测试

    当前位置:我的异常网» Web前端 » selenium经过WebDriverWait实现ajax测试 selenium经过WebDriverWait实现ajax测试 www.MyException. ...

  3. ajax测试Demo以及json简单的转化

    Ajax是局部刷新,并不影响页面其他的操作 实例1:本测试是演示利用Ajax在一个页面播放视频,点击赞和踩按钮,视频不会受影响, 新建一个ajaxTest.html页面 <!DOCTYPE ht ...

  4. ajax测试异步提交

    今天测试了$.ajax()方法: $("a").click(function(){        $.ajax({           url:"MyJsp.jsp&qu ...

  5. 20191204-使用nginx解决ajax测试调用接口跨域问题

    问题描述 之前要测试一个http的接口,在postman中测试成功,但使用ajax调用却跨域.于是通过使用ngin反向代理的方式来解决ajax调用跨域问题 测试页面的内容 <html> & ...

  6. C#开发的WebService使用JSON格式传递数据+Ajax测试

    [C#]  WebService 使用 JSON 格式傳遞筆記 + JQuery 測試 0 2 因為一些因素,必須改寫WebService,很傳統,但是很多公司還在用.. 因為XML 的關係,不想讓他 ...

  7. selenium通过WebDriverWait实现ajax测试,实现等页面元素加载完成

    WebDriverWait(driver, 10)10秒内每隔500毫秒扫描1次页面变化,当出现指定的元素后结束. http://fox1984.iteye.com/blog/1225265new W ...

  8. Selenium测试Ajax程序(转)

    上周末参加了Qclub的百度技术沙龙,听了百度的孙景卫讲了Web自动化测试,讲的非常好,然后在小组讨论时又有幸座在了一起.我们讨论的一个内容,就是Ajax应用程序比原来的非Ajax程序更不易测试,这里 ...

  9. Ajax前台与Mod_python后台应用示例

    Ajax的好处就是可以实现无刷新动态更新.后台配合Mod_python程序,使后台处理变得非常高效简洁.[index.html] <HTML> <head> <meta ...

随机推荐

  1. UOJ 347(洛谷4220) 【WC2018】通道——随机化

    题目:http://uoj.ac/problem/347 https://www.luogu.org/problemnew/show/P4220 先写了暴力分的44分.那个两棵树.其中一棵是编号连续的 ...

  2. 安全关闭MySQL

    想要安全关闭 mysqld 服务进程,建议按照下面的步骤来进行: 0.用具有SUPER.ALL等最高权限的账号连接MySQL,最好是用 unix socket 方式连接: 1.在5.0及以上版本,设置 ...

  3. wkhtmltopdf是一个使用webkit网页渲染引擎开发的用来将 html转成 pdf的工具

    wkhtmltopdf是一个使用webkit网页渲染引擎开发的用来将 html转成 pdf的工具,可以跟多种脚本语言进行集成来转换文档. 官网地址 http://wkhtmltopdf.org/ gi ...

  4. 扩展Linq的Distinct方法动态根据条件进行筛选

    声明为了方便自己查看所以引用 原文地址:http://www.cnblogs.com/A_ming/archive/2013/05/24/3097062.html Person1: Id=1, Nam ...

  5. html页面转换成pdf

    一般页面都是.jsp页面,所以要把.jsp转换成html,在生成pdf,在网上找了好多方法,只有用一个插件,wkhtmltopdf-0.8.3.exe,生成的pdf会相对的好看. 先附上我做的.jsp ...

  6. 在Windows命令行窗口中输入并运行PHP代码片段(不需要php文件)的方法

    有时候只是简单的为了测试某个php函数的效果,以前总是需要建一个php文件,复制这个文件的路径,再通过web访问或者用php命令执行这个php文件. 一直想要怎么才能不用创建文件,才能直接执行PHP代 ...

  7. Oracle 11.2.0.3.0 RAC GI_DB升级到11.2.0.4.0

    转载:  http://blog.csdn.net/frank0521/article/details/18226199 前言 还是大家常说的那句:生产环境千万记得备份哈~~~ 以下的环境,是我的测试 ...

  8. user_add示例

    #!/usr/bin/python3# -*- coding: utf-8 -*-# @Time    : 2018/5/28 16:51# @File    : use_test_add.py 数据 ...

  9. Python之单元测试框架unittest

    创建class继承unittest,每一个测试用例是以test开头的函数,先执行setup,然后用例按照字母的顺序执行,然后执行teardown import unittest class demo( ...

  10. OpenCV Hello World

    ▶ OpenCV 的环境配置与第一个程序 ● 去官网下载安装包 https://opencv.org/releases.html ▶ OpenCL 在Visual Studio 2015 中的配置.注 ...