下拉菜單計算

如何計算用戶選擇的兩個下拉菜單的值的總和。我在HTML中沒有預先確定的值。這裏是我的代碼，我想用選定的價格乘以票數，並顯示給用戶。謝謝。下拉菜單計算

HTML

<select name="price" id="price" style="width:120px"> 

    <option>Select Price</option> 
</select> 
<br> 
<br> 
<select name="tickets" id="tickets" style="width:120px"> 
    <option>Select Tickets</option> 
</select> 

    <br> 
    <br> 
<input name="button" type="button" value="Submit" onClick="return validate2()"/> 
<input name="reset" type="reset" value="Reset" /> 
</form>

的JavaScript

switch (artist.selectedIndex) 
{ 
    case 0: 
     var venueList = ["Select Venue"]; 
     var dateList = ["Select Date"]; 
     var ticketList = ["Select Tickets"]; 
     var priceList = ["Select Price"]; 
     fillList(venue, venueList); 
     fillList(date, dateList); 
     fillList(ticket, ticketList); 
     fillList(price, priceList); 
     break; 

    case 1: 

     var venueList = ["Select Venue", "London"]; 
     var dateList = ["Select Date", "17th July", "18th July"]; 
     var ticketList = ["Select Tickets", "1", "2", "3", "4", "5", "6"]; 
     var priceList = ["Select Price", "£30", "£45", "£70"]; 
     fillList(venue, venueList); 
     fillList(date, dateList); 
     fillList(ticket, ticketList); 
     fillList(price, priceList); 
     break; 

    case 2: 

     var venueList = ["Select Venue", "Manchester", "Glasgow"]; 
     var dateList = ["Select Date"] 
     var ticketList = ["Select Tickets", "1", "2", "3", "4", "5", "6"]; 
     var priceList = ["Select Price", "£35", "£50", "£60"]; 
     fillList(venue, venueList); 
     fillList(date, dateList); 
     fillList(ticket, ticketList); 
     fillList(price, priceList); 

     // adding onchange event on venue when the user selects rod stewart 
     venue.onchange = function() 
     { 
      var dateList; 
      switch(venue.selectedIndex) 
      { 
       case 0: dateList = ["Select Date"]; break; 
       case 1: dateList = ["Select Date", "18th July", "20th July"]; break; 
       case 2: dateList = ["Select Date", "22nd July", "23rd July"]; break; 
      } 
      fillList(date, dateList); 
     } 


     break;

來源

2014-02-07 Danni_B

首先，我要帶的假設，地點，日期，票，價格是選擇元素的引用。

但是與當前的代碼，我建議是這樣的 -

function validate2() { 
    var truePrice = parseFloat(String.replace(price.options[price.selectedIndex].value, '£', '')), 
     noOfTickets = parseInt(ticket.options[ticket.selectedIndex].value); 

    return truePrice * noOfTickets;   
}

http://fiddle.jshell.net/J4Ryy/3/這是基於我的答案:)

來源

2014-02-07 11:15:40 PeteAUK

似乎沒有工作。我已經把這個代碼放到我的JavaScript：功能totalPrice（）{ \t VAR truePrice = parseFloat（與string.replace（price.value， '£'， ''））， noOfTickets = parseInt函數（ticket.value）; return document.getElementById（mytotal）.innerHTML = truePrice * noOfTickets; } 並在我的HTML中有div標記輸出給用戶 –

看起來你錯過了我做的編輯。我忘了你正在使用選擇框，但在我發佈之後就已經意識到了。看看編輯後的代碼;） – PeteAUK

我得到錯誤代碼：未捕獲TypeError：對象函數String（）{[native code]}沒有方法'replace' –

工作撥弄你必須得到兩個下拉菜單的值進入變量。您的下拉列表或其他hthml標記的值是一個字符串。

您必須將字符串轉換爲數字。你如何能做到這一點，你可以在這裏閱讀：How do I convert a String into an integer

之後，你可以做正常的操作，如

var c = var a + var b

Greethings

來源

2014-02-07 11:16:00

使用jQuery：

<script src="https://code.jquery.com/jquery.js"></script> 
<script> 
    $('select').on('change', function (e) { 
     var tickets = $('#tickets').val(); 
     var price = $('#price').val().substring(1); 
     alert(tickets * price); 
    }); 
</script>

說明：每次的選擇框更改，我們通過獲取選擇框的值來計算總價格。 .substring（1）通過從位置1到末尾取一個子字符串來刪除磅符號。

可以更改警報做別的事情，比如把它放在一個盒子：

$('#resultBox').html(tickets * price);

來源

2014-02-07 11:22:36 cbreezier

下拉菜單計算

回答

相關問題