js写的ajax

时间：2023-03-09 04:00:50
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.效果截图

js写的ajax

4.用js实现感觉将list显示出来比较复杂，所以专用jquery。

相关文章