1.添加行数 、列数提交表单
1 <!doctype html> 2 <html> 3 <head> 4 <title>setTable-发送表单</title> 5 <script type="text/javascript"> 6 function checknum1(obj){ 7 var ck1 = obj.value; 8 var pattern=/^\d+$/; 9 if(ck1.match(pattern)==null){ 10 alert("请输入数字"); 11 document.getElementById("ro").value=""; 12 return false; 13 }else{ 14 return true; 15 } 16 } 17 function checknum2(obj){ 18 var ck2 = obj.value; 19 var pattern=/^\d+$/; 20 if(ck2.match(pattern)==null){ 21 alert("请输入数字"); 22 document.getElementById("co").value=""; 23 return false; 24 }else{ 25 return true; 26 } 27 } 28 </script> 29 </head> 30 <body> 31 <div align="center"> 32 <h1>自定义创建表格</h1> 33 <form action="creatTable.jsp" method="post"> 34 请输出创建的行数:<input type="text" name="rows" id="ro" onblur="checknum1(this)"><br/> 35 请输入创建的列数:<input type="text" name="cols" id="co" onblur="checknum2(this)"><br/> 36 <input type="submit" value="提交"> 37 <input type="reset" value= "重置"> 38 39 </form> 40 </div> 41 </body> 42 </html>
2.接收表单、创建表格
1 <!doctype html> 2 <html> 3 <head> 4 <title>creatTable_接收表单</title> 5 6 </head> 7 <body> 8 <% 9 String rows = request.getParameter("rows");//接受表单内容 10 String cols = request.getParameter("cols"); 11 %> 12 <table border="1"> 13 <% 14 for(int i=1;i<=Integer.parseInt(rows);i++){ 15 %> 16 <tr> 17 <% 18 for(int j=1;j<=Integer.parseInt(cols);j++){ 19 %> 20 21 <td> 22 <input type="text"> 23 </td> 24 25 <% 26 } 27 %> 28 29 </tr> 30 <% 31 } 32 %> 33 </table> 34 </body> 35 </html>