HTMLドロップダウンメニューでJSバールを変更する

Question

こんにちは私は、それを購入するリスト項目の1つをクリックすることができるドロップダウンメニューを作成しようとしています。変更すると、項目を購入し、通貨の量を削除します。（私は、HTMLを行う方法が分からない、しかし、私はJavaScriptでバールできます）

HTML

<div class="dropdown"> 
    <button class="dropbtn">Shop</button> 
    <div class="dropdown-content"> 
    <option >Glasses 10$</option> 
    <option >Hat 15$</option> 
    <option >Gold Chain 100$</option> 

Answer 1

私はあなたのコードビットを変更しました。それはあなたが尋ねたものですか？ オプションをクリックするたびに、そのオプションがHTMLから削除され、その値が変数（価格）に累積されます。 価格varには、クリックされたオプション値と削除された各オプション値の合計が含まれます。

<div class="dropdown"> 
    <button class="dropbtn">Shop</button> 
    <div class="dropdown-content"> 
    <option value="10" >Glasses 10$</option> 
    <option value="15">Hat 15$</option> 
    <option value="100">Gold Chain 100$</option> 
    </div> 
    <div id="price">price</div> 

<script src="//code.jquery.com/jquery-1.12.0.min.js"></script> 
<script> 
var price = 0; 
$('.dropdown-content option').bind('click',function(e){ 
    //total price 
    price += parseInt($(this).attr('value')); 

    // remove selected item 
    $(this).remove(); 

    //print total price 
    $('#price').text(price); 
}); 
</script>