首页 > 代码库 > 客户端请求新页面

客户端请求新页面

page1.jsp链接到page2.jsp,几种不同的方法

page1.jsp

 1 <%@ page language="java" contentType="text/html; charset=UTF-8" 2     pageEncoding="UTF-8"%> 3 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 4 <html> 5 <head> 6 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 7 <title>page1</title> 8 <script type="text/javascript"> 9     function fun1(){10         window.location="page2.jsp?id=5";11 }12     function fun2(){13         window.open("page2.jsp?id=9");14     }15     function check(){16         var id =document.getElementById("id2").value;17         if(id==""){18             alert("请输入ID");19             return false;20         }else{21             return true;22         }23     }24 </script>25 </head>26 <body>27     <!-- 链接到page2 -->28     <a href="page2.jsp">链接到page2</a><br/>29     <!-- 链接到page2,弹出新窗口 -->30     <a href="page2.jsp" target="_blank">链接到page2,弹出新窗口</a><br/><br/>31     <!-- 相对路径链接到page2 -->32     <a href="./page2.jsp">相对路径链接到page2</a><br/><br/>33     <!-- 绝对路径链接到page2 -->34     <a href="http://localhost:8080/test/demo1/page2.jsp">绝对路径链接到page2-1</a><br/>35     <a href="<%=request.getContextPath() %>/demo1/page2.jsp">绝对路径链接到page2-2</a><br/>36     <!-- 链接到page2,并传参 -->37     <a href="<%=request.getContextPath() %>/demo1/page2.jsp?id=1">链接到page2,并传参</a><br/>38     39     <!-- 使用js链接到page2 -->40     <a href=‘javascript:window.location="page2.jsp?id=2"‘>使用js链接到page2并传参</a><br/>41     42     <!-- 使用js链接到page2,并传参 -->43     <a href=‘javascript:fun1();‘>使用js方法链接到page2</a><br/><br/>44     45     <!-- 使用js链接到page2,弹出新窗口,并传参 -->46     <a href=‘javascript:fun2();‘>使用js链接到page2,弹出新窗口,并传参 </a><br/><br/>47     48     <!-- submit提交表单 -->49     <form action="page2.jsp" method="post">50         <input type="text" id="id" name="id"/>51         <input type="submit" value="submit提交"/>52     </form>53     <br/><br/>54     55     <!-- 使用JS方法验证true或false,然后再提交表单 -->56     <form action="page2.jsp" method="post" onsubmit="return check()">57         <input type="text" id="id2" name="id"/>58         <input type="submit" value="submit提交"/>59     </form>60     <br/><br/>61     62     <!-- url方式提交数据 -->63     <form action="page2.jsp?id=39" method="post">64         <input type="submit" value="submit提交" />65     </form>66     <br/><br/>67     68     <!-- hidden方式提交数据 -->69     <form action="page2.jsp" method="post">70         <input type="hidden" id="id3" name="id" value="36"/>71         <input type="submit" value="submit提交" />72         <script type="text/javascript">73             document.getElementById("id3").value="38";74         </script>75     </form>76     <br/><br/>77     78     <!-- button+js提交表单 -->79     <form id="form1" action="page2.jsp" method="post">80         <input type="text" id="id4" name="id" value=""/>81         <!-- 也可以单独JS方法,在submit之前写各种判断 -->82         <input type="button" value="button提交按扭" onclick=‘document.getElementById("form1").submit();‘/>83     </form>84     <br/><br/>85     86     <!-- <a>+js提交表单 -->    87         <form action="page2.jsp" id="form2" method="post">88         89             <input type="text" id="id5" name="id" value=""/>90             <a href=‘javascript:document.getElementById("form2").submit();‘>js提交表单</a>91         </form>92 </body>93 </html>

page2.jsp:

 1 <%@ page language="java" contentType="text/html; charset=UTF-8" 2     pageEncoding="UTF-8"%> 3 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 4 <html> 5 <head> 6 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 7 <title>page2</title> 8 </head> 9 <body>10     page2 &nbsp;&nbsp;11     <%12         out.print("参数:"+request.getParameter("id"));13      %>14 </body>15 </html>

 

客户端请求新页面