ホームページ  >  記事  >  ウェブフロントエンド  >  jquery は、リンクをクリックすると、リンクがカスタム カラー効果に変わることを認識します。

jquery は、リンクをクリックすると、リンクがカスタム カラー効果に変わることを認識します。

php中世界最好的语言
php中世界最好的语言オリジナル
2018-03-15 10:18:411927ブラウズ

今回は、リンクをクリックするとリンクがカスタムカラー効果に変わることを認識するjqueryをお届けします注意事項は何ですか。 ? 以下は実際のケースです。

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

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

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

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

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

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

2. 導入プロセス

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

これは デバッグ 比較のプロセスです。

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

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

3、jquery の strings

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

1 のインターセプトは、シンボルが最後に出現した位置、つまり数値を返します。

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

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

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

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

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

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

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

end.

ついにこのマークダウンエディタが使えなくなりました 何度か書いていますが、相変わらずレイアウトが悪いです。 。 。使い方がわかりません。TOT

この記事の事例を読んで、その方法を習得したと思います。さらに興味深い情報については、他の関連記事に注目してください。 php中国語ウェブサイトで!

推奨読書:

jquery で ajax をリクエストし、サーブレットで ajax をレスポンスする

スタートアップ ページでデータを即座にロードする jquery を実現する

入力ボックスとドロップダウン ボックスの連携効果を実現する

Ajax と Jquery をデータベースと組み合わせて、ドロップダウン ボックスの二次リンクを実現します

以上がjquery は、リンクをクリックすると、リンクがカスタム カラー効果に変わることを認識します。の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。