jqueryはリンクをクリックしたときに背景色を表示するメソッドを実装します。

この記事では主に、リンクをクリックしてジャンプ後のリンクの背景色を表示するための jquery メソッドを紹介します。これは良い参考値であり、皆様のお役に立てれば幸いです。編集者をフォローして見てみましょう。皆さんのお役に立てれば幸いです。

私はプロジェクトに取り組んでいたときにこの問題に遭遇しました。誰かがテンプレートの使用方法を知っている限り、そのような低レベルの問題は発生しないはずです。私のバックグラウンドにはテンプレートがなく、私の js と jquery のスキルは小学生レベルなので、これで午後近く私は悩みました。ここにまとめて皆さんにもシェアしたいと思います。シェアすると嬉しいです！ ！ ！

1. コードを見て分析させてください

1. まず、menu は私のメニューリストを表し、a タグはクリックされたリンクです。一般的な考え方は、最初にリンクのオブジェクトを取得し、次にループして、最初にリンクの href 値を取得することです。

2. ジャンプ後のページのURLの値を取得します。比較してください

3. ここで注意を払い、自分で印刷して、比較のための値を取得する方法を確認する必要があります。

4. 比較後、URL は同じです。クリックする前にオブジェクトのクラス属性を削除し、現在のリンクにスタイルを追加します。

2. 実装プロセス

ブログで最も恐ろしいのは、分析が虎のように激しく、実際の操作は 0/5 であることです。そこで、分析するためのいくつかの手順を以下に示します。デバッグと比較のプロセス。

上記は取得したリンクaのhref値です。ここで注意すべきは、ループ状態にあるため、リンクのhref値が多くなるということである。

以下はページのURLを取得する値です。図からわかるように、2つは同等ではありませんが、影響は大きくありません。

3、jquery の文字列のインターセプト

var length = String(window.location).lastIndexOf('?');
var url = String(window.location).substring(0,length);

1。jquery の lastIndexof は、シンボルが最後に出現した位置、つまり数値を返します。

ここから URL を取得するにはどうすればよいですか?出現位置

2. substring は文字列をインターセプトする関数です。ここで意味するのは、0 番目のビットから開始してインターセプトすることです。インターセプトされた長さが長さの値です。

3. インターセプトが成功したら:

 if ($($(this))[0].href == url) {
  $('#menu li a').removeClass("selected");
  $(this).parent().addClass('selected');
  }

URL が等しい場合は、いくつかのスタイルを追加します。

4. 効果を実感してください

これがレンダリングです。 「デバイス分類」欄をクリックするとページがジャンプし、ジャンプ後のページがピンク色で表示され、現在のページがこのページであることを示します。

end.

最後に、このマークダウンエディタの使い方は何度も書いていますが、相変わらずレイアウトがひどいです。 。 。使い方がわかりません、TOTの使い方がわかりません

関連する推奨事項:

JS リンクをクリックして、非表示のコンテンツの表示に切り替えます

HTMLでhrefを使用してクリックを実装しますリンクをクリックしてファイルのダウンロードダイアログボックスをポップアップ表示します サンプルの紹介

JS リンクをクリックして切り替えます 非表示のコンテンツを表示する方法

以上がjqueryはリンクをクリックしたときに背景色を表示するメソッドを実装します。の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。