切換任何按鈕後，檢查多個按鈕的切換狀態

這是我的第一個問題，我的編碼技巧很少，所以請隨身攜帶。切換任何按鈕後，檢查多個按鈕的切換狀態

我正在使用引導程序和jquery來控制一組切換按鈕，以及按下這些按鈕後的影響。 HTML按鈕反覆通過數據肘節=「鍵」來控制：

<div class="btn-group" data-toggle="buttons-radio" style="margin-left:5px"> 
    <button id="fullWidth" class="btn btn-toggle" data-toggle="button">full</button> 
    <button id="halfWidth" class="btn btn-toggle" data-toggle="button">half</button> 
</div> 
<button id="flight" class="btn btn-toggle" data-toggle="button">Flight</button> 
<button id="derived" class="btn btn-toggle" data-toggle="button">Derived</button>

和我的JS段（其在所述網頁體的在莫底部。）如下：

 $('.btn-toggle').click(function() { 
     if (($('#derived').hasClass('active')) && ($("#flight").hasClass('active'))){ 
      DO SOME STUFF 
     } 
     else if ($("#derived").hasClass('active')){ 
      DO SOME STUFF    
      if ($("#halfWidth").hasClass('active')){ 
      DO SOME STUFF    
      } 
      else { 
      DO SOME STUFF    
      } 
     } 
     else if ($("#flight").hasClass('active')){ 
      DO SOME STUFF    
      if ($("#halfWidth").hasClass('active')){ 
      DO SOME STUFF 
      } 
      else { 
      DO SOME STUFF 
      } 
     } 
     else { 
     DO SOME STUFF 
     } 
    });

我的問題是，JS在切換更改之前檢查切換按鈕的狀態。我希望能夠選擇首先更改的選項，然後讓js在之後運行它。

感謝您的幫助。

來源

2013-01-18 Jen

bootstrap切換按鈕只是一個常規按鈕，當點擊時它會更改其CSS類。不幸的是，在引導程序被調用來改變類之前，你的'onclick'的回調運行。您可以製作自己的引導程序'custom-toggle-btn'，擴展常規'btn'，然後手動將'active'類切換爲onclick函數的第一行。事情是這樣的：

$('.custom-btn-toggle').click(function() { 

    $(this).toggleClass('active'); // Add this line – note the change in class-name above 

    if (($('#derived').hasClass('active')) && ($("#flight").hasClass('active'))){ 
     DO SOME STUFF 
    } 
    ...

來源

2013-02-25 23:19:31 Jen

很好，謝謝。注意其他人：這樣做時刪除'data-toggle =「button」'或者你得到一個雙重切換。不知道類'btn-toggle'來自哪裏，我只是使用'type =「button」class =「btn」'，然後通過id選擇。 – juanitogan

-1

您可以嘗試使用jQuery的.toggle（）函數代替.click（）函數。

你可以在The jQuery API中搜索，看看你需要什麼！

來源

2013-01-18 18:15:51 Guido

從我讀，這樣可以在元素本身的CSS和對國家沒有報告它被點擊後的元素。請提供一個代碼示例，如果您知道如何使OPT描述的'.toggle（）'工作。 – reubano

你可以用它代替定義自定義按鈕，自定義active類。您必須同時使用jQuery click和toggleClass函數。首先，添加一個單獨的類別（例如，checked）的，然後在click回調把下面：

callback = function() { 
    $(.btn-toggle).toggleClass('checked'); 
    $(.btn-toggle).hasClass('checked'); 
    // do your checks and other stuff 
} 

$(.btn-toggle).click(callback);

來源

2014-10-27 18:42:59 reubano

切換任何按鈕後，檢查多個按鈕的切換狀態

回答

相關問題