jQuery を使用して変数テキストを照合しますか?
-
25-09-2019 - |
質問
ページの横にブログエントリのタイトルをリストするサイドバーナビゲーションがあります。現在の完全なブログエントリページのタイトルのテキストをチェックし、それをサイドバーナビゲーションの対応するタイトルと照合するjQueryを作成して、アクティブな状態のリンクのスタイルにクラスを適用できるようにしようとしています...でもよく分かりません!サンプルページへのリンクは次のとおりです。 http://ncw-commercial.com/property-listings/eastpoint-plaza-lot.html, 、以下は私の現在のコードです。:contains も使用してみましたが、直接テキストではなく変数で動作させる方法がわかりませんでした。
$('.single-journal-entry-wrapper .journal-entry .title').each(function(){
var activeTitle = $(this).text();
$(".feedburnerFeedBlock .headline a").filter(function(index) {
return $(this).text() == "activeTitle";
}).parent().addClass("activeTitle");
});
解決
(セレクターが正しいと仮定して) 非常に近いものになっていると思います。周囲の引用符を削除するだけです activeTitle
(それ以外の場合は、文字列と比較します "activeTitle"
):
$('.single-journal-entry-wrapper .journal-entry .title a').each(function(){
var activeTitle = $(this).text();
$("#sidebar1 .section .headline a").filter(function(index) {
return $(this).text() == activeTitle;
}).parent().addClass("activeTitle");
});
を使用することもできます。 :contains()
セレクタ:
$('.single-journal-entry-wrapper .journal-entry .title a').each(function(){
var activeTitle = $(this).text();
$("#sidebar1 .section .headline a:contains('" + activeTitle + "')")
.parent().addClass("activeTitle");
});
ページへのリンクはあまり役に立ちません。どういうわけか、どのタイトルとどのリンクを一致させたいのかがわかりません。ごめん。
アップデート:
わかりました。問題は、両方の文字列 (タイトルとリンク内の文字列が一致しないこと) でした。 なぜなら タイトルには
初期化 (Eastpoint Plaza Lot
) サイドバーのリンクにはありませんでした。そして、呼び出すとこれは空白に変換されますが、 .text()
, 、なんとなく合わない。
これは、次の方法でタイトルを取得することで解決できます。 .html()
そして交換してください
スペースを入れると:
$('.single-journal-entry-wrapper .journal-entry .title a').each(function(){
var activeTitle = $(this).html().replace(' ', ' ');
$("#sidebar1 .section .headline a:contains('" + activeTitle + "')")
.parent().addClass("activeTitle");
});
テストのためにすべての HTML コードをコピーしましたが、現在は機能しています。試してみる。最大の問題は、タイトルに HTML エンコードされた文字が含まれている可能性があることです。そのため、さらに問題が発生した場合は、文字を変換するライブラリを見つけてください。