我的腳本有問題

我的jQuery腳本有問題。它有點不錯，但是當我嘗試在它首先工作的類之間切換時。腳本就像它應該改變類一樣。但是當我嘗試再次執行此操作時，我必須單擊鏈接，然後在其他地方，然後再次運行。我希望能夠一遍又一遍地重複整個過程，而無需點擊兩次額外的時間。我的腳本有問題

var clickOnSettings = true; 
$(".settings_link").click(function() { 
    event.preventDefault(); 
    if (clickOnSettings) { 
     $("#coverup").toggleClass("cover1"); 
     $("#settingani").toggleClass("settings1"); 
     clickOnSettings = false; 
    } 
}); 
$("#coverup").click(function() { 
    if (!clickOnSettings) { 
     $("#coverup").toggleClass("cover2"); 
     $("#settingani").toggleClass("settings2"); 
     clickOnSettings = true; 
    } 
});

創建的jsfiddle：

http://jsfiddle.net/5dzt1v6f/13/

來源

2014-09-24 hetasbo

如果切換 'cover1'，你基本上有和沒有的元素 'cover1' 之間進行切換。這並不意味着您在刪除cover1時會自動獲取cover2。

你必須自己做。幸運的是，toggleClass有一個接受布爾值的第二個參數。這使您可以根據您方便地引入的布爾值輕鬆地開啓或關閉課程。

此外，這使得單擊處理兩個元素是相同的：

var clickOnSettings = false; 
$(".settings_link, #coverup").click(function() { 
    event.preventDefault(); 
    clickOnSettings = ! clickOnSettings; 
    //Toggle all classes. 
    $("#coverup").toggleClass("cover1", clickOnSettings); 
    $("#settingani").toggleClass("settings1", clickOnSettings); 
    $("#coverup").toggleClass("cover2", !clickOnSettings); 
    $("#settingani").toggleClass("settings2", !clickOnSettings); 
});

http://jsfiddle.net/5dzt1v6f/20/

來源

2014-09-24 20:24:13 GolezTrol

我明白你是怎麼做到的，但在我的情況下並不奏效。剛剛輸入的div在0.2s以內退出。 – hetasbo 2014-09-24 20:34:29

是的，我發現了。我已經重寫了整個答案，所以現在代碼更短，更乾淨，並且沒有那個神器了。我刪除了舊的代碼片斷，因爲它與此相比是次優的。 – GolezTrol 2014-09-24 20:35:54

這工作就像一個魅力。一直堅持這一點。非常感謝您的幫助！ =） – hetasbo 2014-09-24 20:43:26

你爲什麼不只是使用addClass和removeClass你想要做什麼。

var clickOnSettings = true; 

      $(".settings_link").click(function() { 
       event.preventDefault(); 
       if (clickOnSettings) { 
        $("#coverup").addClass("cover1"); 
        $("#settingani").addClass("settings1"); 
        $("#coverup").removeClass("cover2"); 
        $("#settingani").removeClass("settings2"); 
        clickOnSettings = false; 
       } 
      }); 
      $("#coverup").click(function() { 
       if (!clickOnSettings) { 
        $("#coverup").addClass("cover2"); 
        $("#settingani").addClass("settings2"); 
        $("#coverup").removeClass("cover1"); 
        $("#settingani").removeClass("settings1"); 
        clickOnSettings = true; 
       } 
      });

http://jsfiddle.net/5dzt1v6f/15/

來源

2014-09-24 20:25:37 Akhil

我定了！

不是最漂亮的代碼。但是，這工作，我需要爲settingani另一個類，而不是掩飾。所以我必須這樣做：

 var clickOnSettings = 1; 

     $(".settings_link").click(function() { 
      event.preventDefault(); 
      if (clickOnSettings == 1) { 
       $("#settingani").removeClass("settings0"); 
       $("#coverup").addClass("cover1"); 
       $("#settingani").addClass("settings1"); 
       clickOnSettings = 3; 
      } 
     }); 
     $(".settings_link").click(function() { 
      event.preventDefault(); 
      if (clickOnSettings == 2) { 
       $("#coverup").removeClass("cover2"); 
       $("#settingani").removeClass("settings2"); 
       $("#coverup").addClass("cover1"); 
       $("#settingani").addClass("settings1"); 
       clickOnSettings = 3; 
      } 
     }); 
     $("#coverup").click(function() { 
      if (clickOnSettings == 3) { 
       $("#coverup").removeClass("cover1"); 
       $("#settingani").removeClass("settings1"); 
       $("#coverup").addClass("cover2"); 
       $("#settingani").addClass("settings2"); 
       clickOnSettings = 2; 
      } 
     });

感謝您的所有幫助！ =）

來源

2014-09-24 20:54:03 hetasbo

我的腳本有問題

回答

相關問題