onClick上的jQuery/Javascript增量遞減全局變量

我正在構建一個活動網站，客戶可以在其中籤出活動門票。所以我有活動頁面，客戶必須選擇票數。在下一頁中，我有一個座位圖，客戶必須根據票數選擇座位。onClick上的jQuery/Javascript增量遞減全局變量

現在，讓客戶在活動頁面上選擇5張門票，即ticket_quantity = 5併到達座位圖頁面。我想要做的是，當客戶點擊座位圖上的按鈕並且seat_selected等於ticket_quantity時，只有結帳按鈕將被啓用，否則當條件爲ticket_quantity！= seats_selected或seats_selected> ticket_quantity或seats_selected < ticket_quantity時，它應該被禁用。

我有這個腳本，但不知何故它不工作或部分工作。在腳本中，totalSeats是全局變量，它將保持seatSelected計數，然後它將用於檢查條件。 'thumbnail'是一個類別，它將切換到'縮略圖選擇'在座位圖上選擇座位，反之亦然。

<script> 
    var totalSeats = 0; 
    $('.thumbnail:not(.unavailable)').click(function(){ 
     $(this).toggleClass('selected').length; 
     totalSeats++; 

     if ({{ticket_quantity}} == totalSeats) { 
      $("#button-checkout").prop("disabled", false); 
     } 

     if ({{ticket_quantity}} != totalSeats) { 
      //totalSeats--; 
      $("#button-checkout").prop("disabled", true); 
     } 

    }); 
</script>

問題：它使按鈕seats_selected = tickets_quantity時。但是，當我增加seat_selected然後減少它（例如：seats_selected = 6，然後再次減少到5，它不啓用結帳按鈕）。問題是以上腳本中的totalSeats數量。無論何時onClick事件發生，它都會添加'1'。因此，在每個onClick上，它將爲totalSeats的計數加1。我嘗試了totalSeats--;，但沒有幫助。任何想法腳本有什麼問題？謝謝..！！

來源

2017-08-10 JJS

你需要增加或減少，但你是增加和增加減少。

<script> 
    var totalSeats = 0; 
    $('.thumbnail:not(.unavailable)').click(function(){ 
     $(this).toggleClass('selected'); 
     if ($(this).hasClass('selected')){ 
      if ({{ticket_quantity}} != totalSeats) { 
       totalSeats--; 
       $("#button-checkout").prop("disabled", true); 
      } 
     } else { 
      if ({{ticket_quantity}} < totalSeats) { 
       totalSeats++; 
      } 

      if ({{ticket_quantity}} == totalSeats) { 
       $("#button-checkout").prop("disabled", false); 
      } 
     } 

    }); 
</script>

你減少totalSeats每當已經增加了，你現在看到的錯誤嗎？

來源

2017-08-10 17:41:35

是我發現的bug，但在你的腳本，我沒有得到totalSeats的計數。如果功能不起作用，因此它永遠不會增加totalSeats計數。 – JJS

請看看我的更新。 –

謝謝。我試過這個代碼。控制檯沒有錯誤，但不知何故不適合我。 @Jonas提到的「var」事情確實欺騙了我。 – JJS

簡單地得到

var totalSeats = $(".selected").length;

單擊處理程序內。

或者類設置或刪除您可能需要manualy檢查：

if($(this).hasClass("selected")){ 
    $(this).removeClass("selected"); 
    totalSeats--; 
}else{ 
    $(this).addClass("selected"); 
    totalSeats++; 
}

來源

2017-08-10 17:46:39

是的，這工作。非常感謝。由於選定課程的html頁面上的圖例，它佔用了2個席位。向上投票你的答案。 – JJS

@jjs很樂意幫忙;） –

對不起，我很困惑... –

onClick上的jQuery/Javascript增量遞減全局變量

回答

相關問題