どのように現在のページを指しているリンクに現在の/アクティブなクラスを追加しますか？

Question

私はこのクラスのjQueryコードを書いて、現在のurlとlinkのURLを比較してclassをactiveに割り当てていますが、cとdの変数のurlの最終行をundefinedとして取得しています。

どうしてですか？

var a=window.location.href; 
 
var d=a+$("a.date sort_by_time").attr('href'); 
 
var c=a+$("a.date sort_by_some").attr('href'); 
 
console.log(c); 
 
console.log(d); 
 
if (a==c) { 
 
    $('.date sort_by_time').addClass('active'); 
 
} 
 
if (a==d) { 
 
    $('.date sort_by_some').addClass('active'); 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<span class="date"> 
 
    <p>sorting:&nbsp;</p> 
 
    <a href="?sortby=some" class="sort_by_some"><i class="icon-star-empty"></i>by some</a> 
 
    <a href="?sortby=date" class="sort_by_time">by time<i class="icon-calendar"></i></a> 
 
</span>

Answer 1

私はあなたがここで達成しようとしているのかわからないです。私は 'a'変数がどこから来ているのか分かりません。すべてのコードをあなたの投稿にコピーしていませんか？

これは必要なものですか？そうでない場合は、詳細をお知らせください。

https://jsfiddle.net/at3e1u84/

var d = $(".date > .sort_by_time").attr('href'); 
    var c = $(".date > .sort_by_some").attr('href'); 
    console.log(c); 
    console.log(d); 

UPDATE：私はいくつかの正規表現を追加して、オリジナルのアイデアよりも、それは大きな、より複雑になりました

。私が説明しますなぜ：それは自分自身+添加に比較しているため

a = www.example.com/?sortby=some 
c = www.example.com/?sortby=some?sortby=some 
d = www.example.com/?sortby=some?sortby=time 

C、Dのいずれかに等しくなることはありません：リンクがwww.example.com/?sortby=someある

場合。

私はregexを使ってURLの '？...'部分を取得し、hrefと比較しています。

私はこれがあなたの問題の解決策になることを願っています。ここで

https://jsfiddle.net/at3e1u84/4/

let regex = /\?sort.*/; 
    let matches = (window.location.href).match(regex); 
    var a = matches ? matches[0] : null; 

    var d = $(".date > .sort_by_time").attr('href'); 
    var c = $(".date > .sort_by_some").attr('href'); 
    console.log(a); 
    console.log(c); 
    console.log(d); 
    console.log(window.location.href) 
    if (a == c) { 
    $('.date > .sort_by_time').addClass('active'); 
    } 
    if (a == d) { 
    $('.date > .sort_by_some').addClass('active'); 
    } 

Answer 2

あなたが解決

var a=window.location.href; 
 
var d = a + $("a.sort_by_time").attr('href'); 
 
var c = a + $("a.sort_by_some").attr('href'); 
 
console.log(c); 
 
console.log(d); 
 
if (a==c) { 
 
    $('.date sort_by_time').addClass('active'); 
 
} 
 
if (a==d) { 
 
    $('.date sort_by_some').addClass('active'); 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<span class="date"> 
 
    <p>sorting:&nbsp;</p> 
 
    <a href="?sortby=some" class="sort_by_some"> 
 
    <i class="icon-star-empty"></i>by some 
 
    </a> 
 
    <a href="?sortby=date" class="sort_by_time">by time 
 
    <i class="icon-calendar"></i> 
 
    </a> 
 
</span>

これはあなたを助けることを願って行きます。