ホームページ > 記事 > ウェブフロントエンド > jqueryでページにジャンプする方法
jqueryでページにジャンプする方法
- 藏色散人オリジナル
- 2021-01-29 16:36:5921818ブラウズ
ページにジャンプする jquery メソッド: 最初に jquery ファイルをページに導入し、次にジャンプをトリガーするボタンを作成し、次にジャンプ ボタンのクリック イベントを追加し、最後に jquery を通じて location オブジェクトを操作します。 、 attr メソッドを呼び出し、新しい URL アドレスに href 属性を割り当てます。
動作環境: Acer S40-51、Windows10 Home中国語版、jquery1.8.3&&HBuilderX.3.0.5
推奨事項:「jqueryビデオ」チュートリアル>>
jqueryジャンプページ
まず、スクリプトライブラリファイルをページに導入する必要があります。
次に、HTML サンプル ファイルのテストを作成し、ジャンプをトリガーするボタンを作成します。現在のページは「ページ A」と呼ばれることに注意してください。次に、JS スクリプト ロジックを記述して、ジャンプ ボタンのクリック イベントを追加します。ネイティブ JS では、ジャンプを処理するために window オブジェクトの location 属性を使用することがわかっています。 window.location.href = “abc.html”
jquery を通じて location オブジェクトを操作し、attr メソッドを呼び出し、単に割り当てます。 href 属性を新しい URL アドレスに追加します。
完全なコードをテストします:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Title</title>
<script type="text/javascript" src="https://cdn.bootcdn.net/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
</head>
<body>
<h3>这是页面A</h3>
<div>
<input class="btn btn-primary" type="button" value="跳转">
</div>
<script>
$(document).ready(function () {
$(".btn").click(function () {
$(location).attr("href","testb.html")
})
})
</script>
</body>
</html>ページを実行し、上の [ジャンプ] ボタンをクリックします。
(現在ページ A にいることに注意してください)
クリックすると、新しいページ (testb)
# にジャンプします。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<h3>这是页面B</h3>
</body>
</html> コンピューター プログラミング関連の知識の詳細については、「プログラミング教育」を参照してください。 ！
以上がjqueryでページにジャンプする方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。