3種類型的按鈕，使他們添加數字

Question

我試圖爲電影劇集制定預訂系統。在這個系統中，我添加了3種類型的按鈕，3個按鈕有不同的ID。例如，現在我想讓1個按鈕顯示6歐元。第二個按鈕8歐元，然後當我點擊多個按鈕的價格需要添加和保存，所以我可以去這個劇本的下一個階段。我嘗試了很多谷歌搜索，但我得到的是嚇唬迷你遊戲 - - 如果任何人都可以幫助thnx。

<td><button onclick="kaartverkoop1()" id="kaartverkoop1">B</button></td> 
<td><button onclick="kaartverkoop1()" id="kaartverkoop1">B</button></td> 
<td><button id="kaartverkoop2">O</button></td> 
<td><button id="kaartverkoop2">O</button></td> 
<td></td 

這是兩種按鈕類型的示例。我試圖爲按鈕創建一個函數，並與「kaartverkoop1（）」的代碼一起工作。

function kaartverkoop1(stoel, soort){ 
     if (document.getElementById("resultaat").innerHTML == "") { 
      document.getElementById("resultaat").innerHTML = "De stoel die u heeft gekozen is :"; 
     } 

     document.getElementById("resultaat").innerHTML+= stoel + ","; 
     document.getElementById("resultaat1").innerHTML= "De prijs is "; 
     document.getElementById("resultaat2").innerHTML= "De zaal die u heeft gekozen is Zaal 1 "; 
     document.getElementById("bestel").innerHTML= "Bestel"; 
     document.getElementById("annuleer").innerHTML= "Annuleer"; 
     } 

所以，如果任何人都可以幫助我，我會成爲gratefull。

誠懇，

杜尚

Answer 1

我希望這是你在找什麼：http://jsfiddle.net/1qasuuap/

使用多個項目時，我就從ID的遠離，因爲你不能有多個ID的，它會打破JavaScript：

var buttons = document.querySelectorAll('button[data-price]'); 

var buttonClicked = function (event) { 
    var element = event.target; 
    var price = parseInt(element.data('price')); 
    var totalElement = document.querySelector('[data-total]'); 
    var total = parseInt(totalElement.data('total')); 

    if (element.hasClass('active')) { 
     element.removeClass('active'); 
     total = total - price; 
    } else { 
     element.addClass('active'); 
     total = total + price; 
    } 

    totalElement.data('total', total); 
    totalElement.innerHTML = total; 
}; 

for (var b = 0; b < buttons.length; b++) { 
    var button = buttons[b]; 
    button.addEventListener('click', buttonClicked); 
} 

改爲使用數據屬性。