2

私はHTMLを持っています

<div id="top" class="shadow">
  <ul class="gprc"> 
    <li><a href="http://www.domain.com/">Home</a></li> 
    <li><a href="http://www.domain.com/link1/">Text1</a></li> 
    <li><a href="http://www.domain.com/link2/">Text2</a></li> 
    <li><a href="http://www.domain.com/link3/">Text3</a></li> 
    <li><a href="http://www.domain.com/link4">Text4</a></li> 
  </ul> 
</div>

とJQUERY

$(function () {
    var url = window.location.pathname,
        urlRegExp = new RegExp(url.replace(/\/$/, '') + "$");
    $('#top a').each(function () {
        if (urlRegExp.test(this.href.replace(/\/$/, ''))) {
            $(this).addClass('active');
        }
    });    
});

問題は、ホーム リンクをクリックすると、すべてのタブがアクティブ クラスになり、その理由がわからないことです。最初のリンクがアクティブなクラスを取得しないために必要です。

4

7 に答える 7

3

これをオンにすると、クリックされたタブのみがアクティブになり、すべてのアクティブが削除され、クリックされたタブが追加されます

$("#top a").click(function() {
    $('a').removeClass('active');
    $(this).addClass("active");
});

これをチェックして

于 2013-10-28T15:58:16.510 に答える
3

私もこのソリューションを探していて、あなたのコードをテストしました。最初のアプローチでは、すべてのリンクが強調表示され、他のリンクをクリックすると正しく機能します。ページが読み込まれたときに「イベントが受信されていない」ため、すべてのリンクが強調表示されているため、問題はホームページにありました。理論的には、コマンドを送信するか、各リンクをクリックするとコードが機能します。この動作を停止するには、上記の回答の 1 つにこのコードを見つけ、このコードを追加して、「.sibling()」を「.previousSibling()」に変更します。

$(this).parent().sibling().find('a').removeClass('active');

「.sibling()」はリンクの最後で強調表示され、「.previousSibling()」に変更されるため、最初に移動します (Li)

$(this).parent().previoussibling().find('a').removeClass('active');

コードは次のようになります。

    $(function () {
    var url = window.location.pathname,
        urlRegExp = new RegExp(url.replace(/\/$/, '') + "$");
    $('#top a').each(function () {
        if (urlRegExp.test(this.href.replace(/\/$/, ''))) {
            $(this).addClass('active');
            $(this).parent().previoussibling().find('a').removeClass('active');
        }
    });    
});
于 2015-05-09T16:33:12.427 に答える
1

これを試すことができます。それはあなたを助けるでしょう：

<script type="text/javascript">
    $(function () {
        $('#sidebar li a').each(function () {
            var path = window.location.pathname;
            if (path.indexOf('?') > 0) {
                var current = path.indexOf('?');
            }
            else {
                var current = path;
            }
            var url = $(this).attr('href');
            var currenturl = url.substring(url.lastIndexOf('.') + 1);
            if (currenturl.toLowerCase() == current.toLowerCase()) {
                $(this).addClass('active');
                var par = $(this).parent();
                par.addClass('open');
            }
        });
    });
</script>
于 2015-01-08T06:52:03.153 に答える
-1

次のようなものが必要だと思います：

$(function () {
    $("#top a").click(function(e){
        e.preventDefault();
        $(this).addClass('active');
        $(this).parent().siblings().find('a').removeClass('active');
    });
});

フィドルのデモ

于 2013-10-28T16:00:42.203 に答える