0

このスクリプトは、ワードプレスで生成されたナビゲーション メニューの現在のページにアクティブなクラスを追加します (色を変更し、小さな背景画像の矢印を追加します)。ただし、document.ready 関数は IE 7 & 8 では機能しません。

JQuery:

$(document).ready(function(){
    $('#menu-top-menu a').each(function(index) {
        if(this.href.trim() == window.location)
            $(this).addClass("active");
    });
});

CSS:

.active {color: #41A2FF !important; background-image: url('navarrow.png'); background-repeat: no-repeat; background-position: 50% 3%; padding-top: 10px;}

私はこれをよくグーグルで検索し、このフォーラムで同様のIE <9の問題に関連する多くのトピックを調べましたが、いくつかの回答がウィンドウを指しているように見えました. および .href 宣言が含まれていますが、クラスを追加していない理由を正確に理解できなかったようです。jqueryに関する私の知識は限られているため、助けていただければ幸いです。

-ありがとう

...問題は解決しました。.trim() は IE で動作しませんでした: if($(this).attr("href") == window.location)

4

1 に答える 1

0

.trim() を ie7 & 8 で動作させるには、ヘッダーに追加する必要がある場合:

if(typeof String.prototype.trim !== 'function') {
  String.prototype.trim = function() {
    return this.replace(/^\s+|\s+$/g, ''); 
  }
}

.trim() を使用しない場合:

$(document).ready(function(){
    $('#menu-top-menu a').each(function(index) {
       if($(this).attr("href") == window.location)
            $(this).addClass("active");
    });
});

...しかし、2番目の方法では、クラスをトップレベルのナビゲーションにのみ適用できるように制限されていました

于 2012-11-23T14:31:52.983 に答える