javascript 动态表格的创建
来源：互联网 发布：购买备案过的域名 编辑：程序博客网 时间：2024/05/21 09:12
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%><%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> <title>My JSP 'begain.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"><!--<link rel="stylesheet" type="text/css" href="styles.css">--><script type="text/javascript">function validate(){var num = document.getElementsByName("number")[0];if(parseInt(num.value)<5||parseInt(num.value)>15){num.value = 10;}if(num.value.length<1){alert("输入不能为空！！");num.focus();return false;}return true;}</script> </head> <body> <form action = "end.jsp" name = "form1" method = "post" onsubmit ="return validate();"> 请输入数字（5-15）<input type = "text" name = "number" size ="12"> <input type = "submit" value = "submit"> </form> </body></html><%@ page language="java" import="java.util.*" pageEncoding="utf-8"%><%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> <title>My JSP 'end.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"><!--<link rel="stylesheet" type="text/css" href="styles.css">--><!-- 全选 收缩 展开 的相关功能的实现 相关知识点的说明：通过name获得对象的方法是getElementsByName("name");它获得的可以不止一个对象。getElementsByName("name")[0];得到的是重名中的第一个对象通过id获得对象的方法是getElementById("id");因为id是唯一的，所以它获得的对象也是唯一的。如果操作的数据是多个，则用name获得对象，如果是一个则用id获得对象。--><script type="text/javascript">function checkAll(){var m = document.getElementById("all");//获得对象var s = document.getElementsByName("check");if(m.checked){//如果点击了全选执行下面的方法for(var i = 0;i<s.length; i++){s[i].checked = true;//改变各个复选框的状态}}else{for(var i = 0;i<s.length; i++){s[i].checked = false;//改变各个复选框的状态}}}function turn(){var m = document.getElementById("change");var t = document.getElementById("table");if(m.value == "收缩"){t.style.display = "none";//css中的属性m.value = "展开";//改变按钮的名字}else{t.style.display = "block";//css中的属性m.value = "收缩";//改变按钮的名字}}</script> </head> <body><table border = "1" align = "center" width = "60%" id = "table2"><tr><td><input type = "checkbox" id = "all" onclick = "checkAll();">全选</td><td><input type = "button" value = "收缩" id = "change" onclick = "turn();"></td></tr></table><% int number = Integer.parseInt(request.getParameter("number")); %><table border = "1" align = "center" width = "60%" id = "table"><% for(int i=1;i<number;i++){ %><tr><td><input type = "checkbox" name = "check"></td><td><%= i %></td></tr><% } %></table> </body></html>
