2012-10-08 166 views
0

我正在寫一個Greasemonkey腳本,並且遇到了一個問題,即爲我添加的兩個按鈕設置活動狀態,每個按鈕用於切換。當按下另一個按鈕時,按鈕切換級別保持活動

我已經添加了代碼來分配類。切換按鈕時會出現問題。

例如,當我按按鈕A,它變得活躍。但如果我按按鈕B,按鈕A保持活動狀態。從而讓我有兩個按鈕處於活動狀態。

我知道我可以通過再次按下我的活動按鈕去另一個按鈕之前刪除活動類。不過我想實現的功能是,如果按鈕A處於活動狀態,並且我按按鈕B,則按鈕A失去活動類別,反之亦然。

這裏是我使用的多數民衆贊成分配類我的按鈕代碼:

$('#ButtonA').toggle(function() { 
    $("#ButtonA").addClass("active"); }, function() { 
    $("#ButtonA").removeClass("active"); 
}); 

$('#ButtonB').toggle(function() { 
    $("#ButtonB").addClass("active"); }, function() { 
    $("#ButtonB").removeClass("active"); 
}); 

回答

1

您只需要在第一個回調添加一行爲每個按鈕從任何激活鍵刪除活動類。

$('#ButtonA').toggle(function() { 
    $('button.active').click(); // Remove active class from any active button. 
    // you may adapt 'button.active' to select the proper buttons 
    $('#ButtonA').addClass("active"); 
}, function() { 
    $('#ButtonA').removeClass("active"); 
});​ 


但是,使用的碼對於所有的按鈕,像這樣僅一個塊;

$('#ButtonA, #ButtonB, #ButtonC').toggle(function() { // this refer to the just clicked button. 
    $('button.active').click(); // Remove active class from all other buttons. 
    $(this).addClass("active"); 
}, function() { 
    $(this).removeClass("active"); 
}); 

而不是複製和粘貼。

請參閱http://jsfiddle.net/fNtPP/1/以獲得一個乾淨的重構代碼,顯示帶有3個按鈕的示例。

+1

你的小提琴代碼是可以接受的答案;你應該已經在這裏*以及在第三方網站上顯示。但是,不確定如何使用'click()'是刪除舊類的最好方法。它可能會對目標頁面和/或GM腳本的其餘部分產生副作用。 –

+0

感謝所有。我使用了Stouffi的代碼,它的工作非常完美。再次感謝。 –

2

不清楚爲什麼你要使用這種切換,並儘可能避免CloneAndModifyProgramming

添加一個類來你的按鈕,像這樣:

$("#ButtonA, #ButtonB, #ButtonC").addClass ("MyRadioBtns"); 


然後使用click處理活動狀態:

$("button.MyRadioBtns").click (function (zEvent) { 
    $("button.MyRadioBtns").removeClass ("active"); 
    var jThis = $(this); 
    jThis.addClass ("active"); 

    //- DO WHATEVER ELSE IS DESIRED WITH jThis HERE. 
}); 


See the code in action at jsFiddle