获取2个浮点之间的值

时间:2018-07-25 12:53:09

标签: javascript html

如何获取两个浮点数之间的值。我有两个下拉菜单。每个选项都有其自己的价值(价格)。我想找到从第一个下拉菜单到第二个下拉菜单的所有选项的价格。例如,我选择“黄金1”,改为“黄金3”,我想在这两个选项之间加上每个选项的所有值。因此,“ Gold 1”的值例如为“ 2€”,“ Gold 2”位于这两个值的中间,其值为“ 3€”,而“ Gold 3”的值为“ 4€” 。使用JavaScript。下拉列表以及要在其中添加值的位置位于两个不同的文件中。我设法当他们单击一个选项时,该值将存储在localStorage中。

文件1 HTML:       

    <option value="currgold1">Gold I</option>
    <option value="currgold2">Gold II</option>
    <option value="currgold3">Gold III</option>

  </select>
  <select class="selectDesired" onchange="listenToDropdownChange2();addDesPriceToLocal()" id="desRank">
    <option value="gold1">Gold I</option>
    <option value="gold2">Gold II</option>
    <option value="gold3">Gold III</option>
  </select>

文件1 Javascript

<script>
    function addCurrPriceToLocal(){
      var currRank_ = document.getElementById("currRank").value;
      if(currRank_ == "currgold1"){
        localStorage.setItem("currRankPrice", "€7.50");
      }
      if(currRank_ == "currgold2"){
        localStorage.setItem("currRankPrice", "€7.50");
      }
      if(currRank_ == "currgold3"){
        localStorage.setItem("currRankPrice", "€7.90");
      }

}

function addDesPriceToLocal(){
  var desRank_ = document.getElementById("desRank").value;
  if(desRank_ == "gold1"){
    localStorage.setItem("desRankPrice", "€7.50");
  }
  if(desRank_ == "gold2"){
    localStorage.setItem("desRankPrice", "€7.50");
  }
  if(desRank_ == "gold3"){
    localStorage.setItem("desRankPrice", "€7.90");
  }

}
</script>

文件2 HTML:

<button class="continueToCheckoutFinished" onclick="goToCheckout()" name="checkoutBtnFinished">Checkout</button>

文件2 Javascript

<script>
  function goToCheckout(){
    var currentRankPriceValue = localStorage.getItem("currRankPrice");
    var desiredRankPriceValue = localStorage.getItem("desRankPrice");

    var currpriceWithoutSymbols = currentRankPriceValue.replace('€','');
    var despriceWithoutSymbols = desiredRankPriceValue.replace('€','');

    var currpriceWithoutSymbolsasint = parseFloat(currpriceWithoutSymbols);
    var despriceWithoutSymbolsasint = parseFloat(despriceWithoutSymbols);


    var bothPrices = [currpriceWithoutSymbolsasint, despriceWithoutSymbolsasint];

    var largestPrice = Math.max.apply(Math, bothPrices); // 306
    var smallestPrice = Math.min.apply(Math, bothPrices); // 306


    function range(start, end) {
      return Array(end - start + 1).fill().map((_, idx) => start + idx)
    }

    var result = range(smallestPrice, largestPrice); // [9, 10, 11, 12, 13, 14, 15, 16, 17, 18]
    alert(result);
    var difference = eval([result].join('+'));


    var rightPrice = largestPrice + smallestPrice + difference;
    alert(largestPrice + "-" + smallestPrice + "+" + difference + "=" + rightPrice);

    window.open("https://www.paypal.me/WAVEBOOSTING/" + rightPrice + "eur", "_self");
  }
</script>

1 个答案:

答案 0 :(得分:0)

看看这个例子,也许会有助于找到适合您的版本的东西。 请记住,最终用户可以更改其localStorage,因此请记住,如果这是真实应用程序的一部分。

// All prices are in cents.
var PRICES = [
	{ price: 750,  label: 'gold1' },
	{ price: 725,  label: 'gold2' },
	{ price: 750,  label: 'gold3' },
	{ price: 875,  label: 'gold4' },
	{ price: 810,  label: 'gold5' },
	{ price: 915,  label: 'gold6' },
	{ price: 365,  label: 'gold7' },
	{ price: 1005, label: 'gold8' },
];
// Add an option item to both dropdowns for each price entry we have in our model.
// The big advantage being that adding an entry to thr prices is all we need to do to add more options.
// So we avoid having to add more option nodes to our HTML and avopid ahving to write if statements to get their value.
var render = function() {
 var price_start = document.querySelector( '#price_start' );
 var price_end = document.querySelector( '#price_end' );
 var options = PRICES.map(( entry, index ) => '<option value="' + index + '">' + entry.label + '</option>' ).join('');
	price_start.innerHTML = options;
	price_end.innerHTML = options;
};
var calculateTotal = function() {
 var index_start = parseInt( document.querySelector( '#price_start' ).value, 10 );
 // Since we want to include the selected option, index + 1.
 var index_end = parseInt( document.querySelector( '#price_end' ).value, 10 ) + 1;
 var sum = PRICES.slice( index_start, index_end ).reduce(( sum, next ) => sum + next.price, 0 ) / 100;
	alert( 'total of € ' + sum );
};
render();
<select id="price_start"></select>
<select id="price_end"></select>
<button onclick="calculateTotal()">Total</button>