如何使用自定義屬性觸發某個按鈕

Question

我通過url獲取變量。 http://mysite.com/?category_id=1 我想用一個類別的id屬性觸發按鈕：
<a class="cat-item" category-id="1" href="#">

我沒有得到的URL參數的問題。我唯一的問題是如何在加載站點後觸發按鈕。

感謝您的幫助。

Answer 1

嘗試使用這樣的：

function getUrlVars() 
{ 
    var vars = [], hash; 
    var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&'); 
    for(var i = 0; i < hashes.length; i++) 
    { 
        hash = hashes[i].split('='); 
        vars.push(hash[0]); 
        vars[hash[0]] = hash[1]; 
    } 
    return vars; 
} 

$(document).ready(function() { 
    var catVal = getUrlVars()["category_id"]; 
    $('a[category-id="' + catVal +'"]').click(); 
}); 

Answer 2

您可以通過像下面的屬性查詢它選擇特定的錨標記。

$(document).ready(function() { 
    var button = $('a[category-id="' + your id from the url + '"]', '#categoryMenu'); 
    button.click(); //if your intention was to trigger the click event. 
    button.trigger("some event name"); //if your intention was to trigger some other event. 
}); 

正如你所看到的，我將第二個參數傳遞給jQuery選擇器。我這樣做只是將搜索範圍縮小到id爲'categoryMenu'的容器，以防止jQuery搜索整個DOM。這將使您在此選擇器上獲得更好的性能。

所以我的建議是....

把按鈕放在一個包裝DIV這樣你就可以應用該技術

<div id="categoryMenu"> 
    <a class="cat-item" category-id="1" href="#">category 1</a> 
    <a class="cat-item" category-id="2" href="#">category 2</a> 
    <a class="cat-item" category-id="3" href="#">category 3</a> 
    <a class="cat-item" category-id="4" href="#">category 4</a> 
    <a class="cat-item" category-id="5" href="#">category 5</a> 
</div>