jQuery在標籤圖像之間切換

我正在努力與一個簡單的切換。那麼，它應該很簡單。我正在訪問論壇和主題，無法完成它的工作。jQuery在標籤圖像之間切換

我有三個選項卡的圖像（不屬於任何包的一部分），我只是想點擊的圖像切換到「開」和別人開關置於「OFF」

<img class="mastheadTab" id="products" src="#application.viewImageDIR#/tab_products_on.gif" width="119" height="31" hspace="4"> 

<img class="mastheadTab" id="suppliers" src="#application.viewImageDIR#/tab_suppliers_off.gif" width="117" height="31" hspace="4"> 

<img class="mastheadTab" id="buyers" src="#application.viewImageDIR#/tab_buyers_off.gif" width="117" height="31" hspace="4">

這裏是我懈怠了jQuery，這是需要修復的。不知何故，我需要重新初始化標籤，因爲點擊互相交叉，在錯誤的位置顯示錯誤的圖像，直到第二次或第三次點擊後才切換狀態。

$(".mastheadTab").live("click", function(e) { 
var tab = $(this).attr("id") 

$('.mastheadTab').toggle(
    function(){$(this).attr("src", "/chinabuy-new/images/website/tab_" + tab + "_on.gif"); }, 
    function(){$(this).attr("src", "/chinabuy-new/images/website/tab_" + tab + "_off.gif"); } 
); 
e.preventDefault(); 
});

來源

2010-11-05 Paul

您可以在點擊時獲得id，就像這樣：

$(".mastheadTab").click(function(){ 
    //turn the others off 
    $(".mastheadTab").not(this).attr("src", function(i, src) { 
    return src.replace("_on", "_off"); 
    }); 
    //toggle this image's source 
    this.src = this.src.replace(/(_off|_on)/, function(i, m) { 
    return m == "_off" ? "_on" : "_off"; 
    }); 
});

目前你得到id的點擊圖像並附加新切換設置的click每次處理程序。相反，只需使用上面的代碼即可獲得點擊圖像的id。

來源

2010-11-05 21:52:52

感謝尼克，這停止了交叉。還有兩個問題： 1）需要兩次點擊才能在第一次加載時更改標籤 2）我需要關閉 – Paul 2010-11-05 21:54:58

@Paul上的其他標籤 - 嘗試更新後的答案，它應該解決這兩個問題。 – 2010-11-05 22:01:21

尼克，謝謝，但它仍然在做奇怪的事情。這裏是一個鏈接，所以你可以看到發生了什麼： http://www.china-buy.com/chinabuy-new/index.cfm – Paul 2010-11-05 22:14:02

jQuery在標籤圖像之間切換

回答

相關問題