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

Question

我很难找到一个方法或函数来实际进行适当的 var 检查，并使用相应的选定值作为我的 selectedCheck 在我的计算中运行。我将其设置为对象的原因是因为有多种类型的支票，每种类型都有不同的选项值、数量和价格。

这是迄今为止我的代码:

    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));

    <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>

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'));
});