2017-10-20 159 views
0

我已經寫了這行jQuery代碼來比較當前的URL和鏈接URL來分配活動的類,但沒有定義c和d變量的url最後一行。如何將類當前/活動添加到指向當前頁面的鏈接?

這是怎麼發生的?

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>

回答

0

我不知道你正試圖在這裏實現什麼。我不確定'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:

我已比你原來的想法很大的更復雜的加入一些正則表達式。我會解釋爲什麼:

如果鏈接www.example.com/?sortby=some:

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

,因爲它比較本身的+添加可以永遠不等於C或d 。

這就是爲什麼我使用正則表達式來獲取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'); 
    } 
+0

thnx爲快速回復我想要與當前網址進行比較ut在控制檯日誌中的$ c $ d變量的結尾處得到未定義 –

+0

(index):48 https://fiddle.jshell.net/_display/undefined (index):49 https://fiddle.jshell.net/_display/undefined –

+0

它顯示未定義在url-s的末尾。 –

0

在這裏,你去了一個解決方案

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>

希望這會幫助你。

相關問題