根据选项值匹配选择对象变量

Question

在这方面寻求一些帮助，因为我对 javaScript 还很陌生（我几天前才开始学习）。无论如何，我很难找到一个方法或函数来实际使用相应的选定值作为我的 selectedCheck 进行适当的 var Check 以在我的计算中运行。我将其设置为对象的原因是因为有几种类型的支票，每种都有不同的选项值、数量和价格。

无论如何，这是我目前的代码：

<select class="priceDrp5">
<option value="1785-00050/check-11">50</option>
<option selected="true" value="1785-00250/check-11">250</option>
<option value="1785-00500/check-11">500</option> 
<option value="1785-001000/check-11">1000</option>
<option value="1785-002000/check-11">2000</option>
</select>

<script>
function selectedCheck(current_quantity, current_price, projected_quantity, projected_price, optionValue) {
this.current_quantity = current_quantity;
this.current_price = current_price; 
this.projected_quantity = projected_quantity;
this.projected_price = projected_price;
this.optionValue = function getValueFromOption() {
var x = document.getElementsByTagName("option").each().getAttribute("value");
if (x === this.optionValue) { 

     /* Make the matching var check the selectedCheck */

    }
  };
}

/*Secure Plus Voucher Checks*/
var check_11_50 = new selectedCheck(50, 66.99, 250, 169.99, "1785-00050/check-11");
var check_11_250 = new selectedCheck(250, 169.99, 500, 230.99, "1785-00250/check-11");
var check_11_500 = new selectedCheck(500, 230.99, 1000, 327.99, "1785-00500/check-11");
var check_11_1000 = new selectedCheck(1000, 327.99, 2000, 514.99, "1785-01000/check-11");


/*Calculations*/
var current_pricepercheck = (selectedCheck.current_price - selectedCheck.current_quantity).toFixed(2);
var projected_pricepercheck = (selectedCheck.projected_price - selectedCheck.projected_quantity).toFixed(2);
var current_price_bulk = (selectedCheck.current_price / selectedCheck.current_quantity * selectedCheck.projected_quantity).toFixed(2);
var projected_price_bulk = (selectedCheck.projected_price / selectedCheck.projected_quantity * selectedCheck.projected_quantity ).toFixed(2); 
var savings = ( selectedCheck.current_price_bulk - selectedCheck.projected_price_bulk).toFixed(2);   
document.getElementById("savings").innerHTML = (savings.toFixed(2));
</script>

另外，如果我要绕道而行，请告诉我。我总是乐于听取捷径。提前致谢。

Answer 1

与其稍后使用检查对象值进行计算，不如在实例化它们时进行计算。这肯定可以进一步优化，但它有效！顺便说一句，正如你所看到的，我最终没有使用 jquery。

js fiddle（通常情况下）表现不佳，所以我写了一个DEMO ON CODEPEN

var checks = {};
function selectedCheck(quantity, price, projectedQuantity, projectedPrice, itemNumber) {
  var check = {
    pricePerCheck: (price - quantity).toFixed(2),
    projectedPricePerCheck: (projectedPrice - projectedQuantity).toFixed(2),
    priceBulk: (price / quantity * projectedQuantity).toFixed(2),
    projectedPriceBulk: (projectedPrice / projectedQuantity * projectedQuantity).toFixed(2),
    getSavings: function() { return (this.priceBulk - this.projectedPriceBulk).toFixed(2) } 
  };

  checks[itemNumber] = check;
}

selectedCheck(50, 66.99, 250, 169.99, "1785-00050/check-11");
selectedCheck(250, 169.99, 500, 230.99, "1785-00250/check-11");
selectedCheck(500, 230.99, 1000, 327.99, "1785-00500/check-11");
selectedCheck(1000, 327.99, 2000, 514.99, "1785-01000/check-11");

document.addEventListener('DOMContentLoaded', function() {
  var priceDrpSelect = document.querySelector('.priceDrp5'),
      savings = document.getElementById("savings"),
      selectedCheck;
  console.log(JSON.stringify(checks, null, 4))
  priceDrpSelect.addEventListener('change', function(e) {
    var key = this.options[this.selectedIndex].getAttribute('value');
    selectedCheck = checks[key];
    savings.innerHTML = selectedCheck.getSavings();
  });
  priceDrpSelect.dispatchEvent(new Event('change'));
});