ホームページ >ウェブフロントエンド >jsチュートリアル >JS を使用してページにジャンプする 7 つの方法 (共有)

JS を使用してページにジャンプする 7 つの方法 (共有)

青灯夜游転載: 2021-01-28 19:09:243704ブラウズ

多くの Web 開発者は、Web プログラムを開発するときにページ間をジャンプする方法はたくさんあることを知っていると思いますが、効果的にジャンプすると、半分の労力で 2 倍の結果が得られます。日常の開発で使用される 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>

2 番目のタイプ: 前に戻るワンタイムプレビューインターフェイス

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

タグのネスト:

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

3 番目のタイプ:ジャンプページの指定はフレームに対して無効です

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

4 番目の方法: セルフジャンプページの指定はフレームでは無効です

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

5 番目の方法: セルフジャンプページの指定はフレームでは有効です

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

6 番目のタイプ: ボタンにイベントジャンプを追加する

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

7 番目のタイプ: 新しいウィンドウで開く

<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 中国語 Web サイトの他の関連記事を参照してください。

声明：

この記事はcnblogs.comで複製されています。侵害がある場合は、admin@php.cn までご連絡ください。

前の記事：反応ライフサイクルの概要次の記事：反応ライフサイクルの概要

続きを見る