js写的ajax
1.jsp
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>"> <title>My JSP 'Score.jsp' starting page</title> <meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page"> <script type="text/javascript" src="js/jquery.js"></script>
<link rel="stylesheet" type="text/css" href="css/table1.css"> </head> <body>
<script type="text/javascript">
var xmlHttp;
var clock; function createXMLHttpRequest() {
if (window.ActiveXObject) {
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
} else if (window.XMLHttpRequest) {
xmlHttp = new XMLHttpRequest();
}
} function change() { var course=$("#course").val();
var classs=$("#classs").val();
var number=$("#number").val();
var name=$("#name").val();
createXMLHttpRequest();
xmlHttp.open("post", "Score.action", true);
xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
xmlHttp.onreadystatechange = onReadyState;
xmlHttp.send("course="+course+"&classs="+classs+"&number="+number+"&name="+name+"");//提交form表单中的内容
} function onReadyState() {
if (xmlHttp.readyState == 4) {
if (xmlHttp.status == 200) {
alert(xmlHttp.responseText);
};
};
}; </script> <form id="form" action="" enctype="application/x-www-form-urlencoded">
<table>
<tr>
<th>课程<input name="course" id="course" type="text" size="10"></th>
<th>班级<input name="classs" id="classs" type="text"></th>
<th>学生学号<input type="text" id="number" name="number"></th>
<th>学生姓名<input type="text" id="name" name="name"></th>
<th><input type="button" value="查询" onclick="change()"></th>
</tr>
</table>
</form> <table cellpadding="4" >
<tr>
<th>学号</th>
<th>姓名</th>
<th>班级</th>
<th>课程</th>
<th>成绩</th>
</tr>
<s:iterator value="scorelist">
<tr >
<td id="aa"></td>
<td><s:property value="id.{number}.toString().substring(1,id.{number}.toString().length()-1)"/></td>
<td><s:property value="id.{name}.toString().substring(1,id.{name}.toString().length()-1)"/></td>
<td><s:property value="id.{classs}.toString().substring(1,id.{classs}.toString().length()-1)"/></td>
<td><s:property value="id.{course}.toString().substring(1,id.{course}.toString().length()-1)"/></td>
<td><br><s:property value="id.{score}.toString().substring(1,id.{score}.toString().length()-1)"/></td>
</tr>
</s:iterator>
</table>
</body>
</html>
2.action中的提交数据
HttpServletResponse response = ServletActionContext.getResponse();
response.setContentType("text/html;charset=utf-8");
PrintWriter out = response.getWriter();
out.print(scorelist);//传到前台的值
out.flush();
out.close();
3.效果截图
4.用js实现感觉将list显示出来比较复杂,所以专用jquery。
js写的ajax的更多相关文章
- 原生JS写的ajax函数
参照JQuery中的ajax功能,用原生JS写了一个ajax,功能相对JQuery要少很多,不过基本功能都有,包括JSONP. 调用的方式分为两种: 1. ajax(url, {}); 2. ajax ...
- ajax简介及JS写原生ajax
ajax 1.什么是ajax ajax 的全称是Asynchronous JavaScript and XML,其中, Asynchronous 是异步的意思,指的是异步 JavaScript 和 X ...
- js 封装原生ajax
jquery框架的ajax方法固然好用,但是假如某天我们的项目不能引入jquery或项目需求很简单,没有很多交互功能,只需要ajax,这时引入jquery库会造成资源浪费,也会显得页面臃肿.这时我们就 ...
- 原生js写Ajax
//原生js写ajax就像打电话 //打电话分下面4步//1.拿出手机//2.拨号//3.说话//4.挺对方说话 //ajax也分下面4步//1.创建ajax对象//2.连接到服务器//3.发送请求( ...
- 手写原生ajax
关于手写原生ajax重要不重要,各位道友自己揣摩吧, 本着学习才能进步,分享大家共同受益,自己也在自己博客里写一下 function createXMLHTTPRequest() { //1.创建XM ...
- 写一个ajax程序就是如此简单
写一个ajax程序就是如此简单 ajax介绍: 1:AJAX全称为Asynchronous JavaScript and XML(异步JavaScript和XML),指一种创建交互式网页应用的网页开发 ...
- 引入js文件,ajax不执行操作
今天写了一个页面,在页面中写的可以执行,但是放到js里面,引入到页面,ajax却不执行了,仔细一看原来是路径的原因 ${pageContext.request.contextPath} 为获取项目名称 ...
- JS写一个简单日历
JS写一个日历,配合jQuery操作DOM <!DOCTYPE html> <html> <head> <meta charset="UTF-8&q ...
- 用javascript写原生ajax(笔记)
AJAX 的全名叫做 Asynchronous JavaScript and XML(异步的 JavaScript 和 XML).它最大的优点是在不重新加载整个页面的情况下,可以与服务器交换数据并 ...
随机推荐
- .NET委托和事件
.net学习之委托和事件 1.什么是委托 通俗的说:委托就是一个能够存储符合某种格式(方法签名)的方法的指针的容器 上传图片: 2.委托语法 准备一个方法:string Hello(string ...
- oracle中scn(系统改变号)
系统scn: select checkpoint_change# from v$database; 文件scn: select name ...
- 雾里看花般的迷茫--货运APP
移动互联网正在改变我们的生活方式,各种手机APP充斥着人们的生活,物流行业也不例外.货运APP的出现,对于物流行业是一个提升的机会,也是迈向标准化和专业化的一个有效途径. 经过三十多年的发展,我国物流 ...
- Make cnblogs mobile Compatible
Introduction 博客园的许多页面都是只支持PC的,没有手机端的,也没有手机端的app.每次查看都有放大了才能看清楚字体,手指和游泳似的,左右开弓,很不方便.还有上次我修改了theme之后,手 ...
- 初始python第三天(三)
全局变量与局部变量 1.什么是全局变量 在globals中的变量,都是全局变量,全局变量的作用域就是整个程序 NAME = 'alex' def global_test(): name = 'alex ...
- 让 MySQL 在 Linux 下表名不区分大小写(实为表名全小写)
把 Windows 下的应用部署到 Linux 下,使用到了 Quartz 集群的特性,所以建了 MySql 的中间表,一启动看到报错: Invocation of init method faile ...
- Hadoop深入浅出实战经典–第02讲
本文转载:通通学--知识学习与分享平台 Hadoop的核心 HDFS: Hadoop Distributed File System 分布式文件系统 MapReduce:并行计算框架 Yarn:集群资 ...
- GUID 全局统一标识符的介绍
GUID(全局统一标识符)是指在一台机器上生成的数字,它保证对在同一时空中的所有机器都是唯一的.通常平台会提供生成GUID的API.生成算法很有意思,用到了以太网卡地址.纳秒级时间.芯片ID码和许多可 ...
- sql-按周输出每月的周日期范围
--日期参数,此处可以建立存储过程,接收月份,计算月开始结束时间或者直接接受开始与结束时间 declare @begDate datetime = '2014-06-01' declare @endD ...
- Win7下Doxygen配置与使用
1. 下载与安装 1.1 下载 Doxygen官方安装程序及其手册下载地址,目前使用版本为1.8.8. 安装程序:http://www.stack.nl/~dimitri/doxygen/downl ...