집 > 기사 > 웹 프론트엔드 > JS를 사용하여 페이지로 이동하는 7가지 방법(공유)

JS를 사용하여 페이지로 이동하는 7가지 방법(공유)

青灯夜游앞으로: 2021-01-28 19:09:243653검색

많은 웹 개발자들이 웹 프로그램을 개발할 때 페이지 사이를 이동하는 방법은 많지만 효과적인 점프는 절반의 노력으로 두 배의 결과를 얻을 수 있다는 것을 알고 있다고 믿습니다. 7 JavaScript 점프 방법.

첫 번째: 매개변수를 사용하여 직접 점프

<script language="javascript" type="text/javascript">
window.location.href="login.jsp?backurl="+window.location.href; 
</script>

매개변수 없이 직접 점프:

<script>window.location.href=&#39;http://www.baidu.com&#39;;</script>

두 번째: 마지막 미리보기 인터페이스로 돌아가기

<script language="javascript">
alert("返回");
window.history.back(-1);
</script>

태그 중첩:

<a href="javascript:history.go(-1)">返回上一步</a>
<a href="<%=Request.ServerVariables("HTTP_REFERER")%>">返回上一步</a>

세 번째: 지정 점프 페이지가 프레임에 유효하지 않습니다

   <script language="javascript">
       window.navigate("top.jsp");
  </script>

네 번째 방법: 자체 점프 페이지 지정이 프레임에 유효하지 않습니다

   <script language="JavaScript">
          self.location=&#39;top.htm&#39;;
   </script>

다섯 번째 방법: 자체 점프 페이지 지정이 프레임에 유효합니다

   <script language="javascript">
          alert("非法访问！");
          top.location=&#39;xx.aspx&#39;;
   </script>

여섯 번째 방법: 버튼 유형 추가 이벤트 점프 버튼 버튼

<input name="pclog" type="button" value="GO" onClick="location.href=&#39;login.aspx&#39;">

일곱 번째: 새 창에서 열기

<a href="javascript:" onClick="window.open(&#39;login.aspx&#39;,&#39;
&#39;,&#39;height=500,width=611,scrollbars=yes,status=yes&#39;)">开新窗口</a>

예:

<head> 
<script language="javascript">

function old_page() 
{ 
window.location = "login.aspx" 
} 
function replace() 
{ 
window.location.replace("login.aspx") 
} 
function new_page() 
{ 
window.open("login.aspx") 
} 
</script> 
</head> 
<body> 
<input type="button" onclick="new_page()" value="在新窗口打开s"/> 
<input type="button" onclick="old_page()" value="跳转后有后退功能"/> 
<input type="button" onclick="replace()" value="跳转后没有后退功能"/> 
</body>

더 많은 프로그래밍 관련 지식을 보려면 다음을 방문하세요:프로그래밍 교육! !

위 내용은 JS를 사용하여 페이지로 이동하는 7가지 방법(공유)의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명：

이 기사는 cnblogs.com에서 복제됩니다. 침해가 있는 경우 admin@php.cn으로 문의하시기 바랍니다. 삭제

이전 기사：React 라이프사이클 소개다음 기사：React 라이프사이클 소개