如何获取两个浮点数之间的值。我有两个下拉菜单。每个选项都有其自己的价值(价格)。我想找到从第一个下拉菜单到第二个下拉菜单的所有选项的价格。例如,我选择“黄金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>
答案 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>