Обновите динамически цену с помощью Select opton для разных опций + цена на Dipslay выше - PullRequest
Новая
       2

Обновите динамически цену с помощью Select opton для разных опций + цена на Dipslay выше

0 голосов
/ 05 ноября 2019

Мне нужно создать функцию JavaScript и HTML5 или простой HTML. Функция должна взаимодействовать с выбранными формами из HTML и отображать цену выше. Например, пользователь хочет выбрать цикл выставления счетов, 1 месяц 1 год, 2 года, 3 года, для каждого года цена отличается, как показано ниже, но мне нужно добавить дополнительную КНОПКУ ЗАКАЗА в эти списки, когда пользователь выбирает 1 год. , автоматически цена за 1 год отображается над списком, а затем, когда пользователь нажимает ЗАКАЗАТЬ СЕЙЧАС, автоматически перейти по ссылке, которая у меня есть для этой опции. 

<p>
  <select name="forma" onchange="location = this.value;">
    <option value="link">1 Month, 19.90€, VAT Excl.</option>
    <option value="link">1 Year, 14.90€/mo, VAT Excl.</option>
    <option value="">2 Years, 13.90€/mo, VAT Excl.</option>
    <option value="link">3 Years, 12.90€/mo, VAT Excl.</option>
  </select>
</p>

(я пробовал этот вариант выше, но это когдаЯ выбираю один вариант, автоматически перенаправляю по ссылке, без отображения цены и т. Д.)

Кто-нибудь может мне помочь?

Я пробовал этот код, но нужно изменить 

<script type="text/javascript">
function updatePrice() {
  var price = document.getElementById("product").value;
  var size_price = document.getElementById("size").value;

  var a=parseInt(price);//parsed type price
  var b=parseInt(size_price);//parsed size price

  if(size_price != "null")//if the value selected is not null then add the prize
  {
        var fin_price = a+b; //add the prices
  }
  else //if the value selected is null then fin_prize=price 
  { 
       var fin_price = price;    
  }
  document.getElementById("price").innerHTML="<p>PRICE: " + fin_price + "</p>";
}
</script>

<br>
<label >Shirt Type</label>

<body onload="updatePrice()">
    <select id="product" onchange="updatePrice()">
         <option id="basic" value="20.00"> Basic Shirt (€20.00)</option>
         <option id="poly" value="25.00">Poly-Cotton Blend (€25.00)</option>
         <option id="gildan" value="28.00">Gildan Cotton (€28.00)</option>
         <option id="organic" value="30.00">Organic Cotton (€30.00)</option>
    </select>

    <div id="price"><p>PRICE: €XX.XX</p></div>

     <label >Shirt Size</label>

     <select id="size" onchange="updatePrice()">
         <option id="None" value="null">Choose Size</option>
         <option id="Small" value="0.00">Small</option>
         <option id="Medium" value="0.00">Medium</option>
         <option id ="Large" value="0.00">Large</option>
         <option id ="XL" value="0.00">XL</option>
         <option id ="XXL"value= "2.00">XXL</option>
         <option id ="XXXL" value="3.00">XXXL</option>
     </select>
...