计算选定项目的成本,然后计算总成本

implement cost for select items then total

本文关键字:计算 然后 总成本 项目      更新时间:2023-09-26

我仍然试图剖析这段代码,我从这里得到的,工作得很好,但我需要实现一个成本金额到它。

我有脚本设置做价格*数量,但我正试图找出如何做价格-成本*数量。

我是新的脚本,我试图找出这个

这就是HTML的样子

<select name="item" id="item" size="1">
              <option value="">Device</option>
              <option value="200.00">iPhone 4</option>
              <option value="300.00">iPhone 4S</option>
              <option value="450.00">iPhone 5</option>
              <option value="300.00">Galaxy S3</option>
              <option value="450.00">Galaxy S4</option>
              <option value="450.00">Galaxy Note ll</option>
              <option value="600.00">Galaxy Note lll</option>
              <option value="700.00">Galaxy S5</option>
              <option value="500.00">HTC One</option>
              <option value="650.00">HTC One M8</option>
            </select>
          </div></td>
          <td><div align="center">
            <div align="center"><span id="price"></span></div>
          </div></td>
            <td height="43">
                <div align="center"><span id="cost"></span></div>
            </td>
            <td>
                <div align="center">
                  <input name="qty" type="Text" id="qty" size="2" maxlength="3"/>
                </div>
            </td>

            <td>
                <div align="center">
                    <span id="result"></span>

,这就是脚本的样子。

var phones = document.getElementById('phones');
var phones1 = document.getElementById('phones1');
var phones2 = document.getElementById('phones2');
var phones3 = document.getElementById('phones3');
item.onchange = function() {
        price.innerHTML = "$" + this.value;
        qty.value = 1; //Order 1 by default.
        add();
    };
function add() {
  var inputs = document.getElementsByTagName('input');
  var selects = document.getElementsByTagName('select');
  var total = 0;
  var taxes = 0;
  for (var i = 0; i < selects.length; i++) {
    var sum = 0;
    var price = (parseFloat(selects[i].value) )?parseFloat(selects[i].value):0;
    var qty = (parseFloat(inputs[i].value) )?parseFloat(inputs[i].value):0;
    sum += price * qty;
    total += sum * 1.06
    taxes += sum * 0.06
    if(i == 0){
      document.getElementById('result').innerHTML = "$" + sum;
    }else{
      document.getElementById('result'+i).innerHTML = "$" + sum;
    }             
  };
  document.getElementById('total').innerHTML = "$" + total.toFixed(2);
  document.getElementById('taxes').innerHTML = "$" + taxes.toFixed(2);

}

是否有一种方法,我可以在选项中合并第二个值,并在脚本中使用对它的引用?我只是想弄明白。

我确实试过添加

<option value="200.00" value2="100">iPhone 4</option>

然后像这样放到脚本中

item.onchange = function() {
    price.innerHTML = "$" + this.value;
    cost.innerHTML = "$" - this.value;
    qty.value = 1; //Order 1 by default.
    add();
};

但是不工作

试试:

item.onchange = function() {
        price.innerHTML = "$" + this.value;
        cost.innerHTML = "$" + (-this[this.selectedIndex].getAttribute('value2'));
        qty.value = 1; //Order 1 by default.
        add();
    };

然后这样修改add():

var cost = (parseFloat(selects[i][selects[i].selectedIndex].getAttribute('value2')) )?parseFloat(selects[i][selects[i].selectedIndex].getAttribute('value2')):0;
var qty = (parseFloat(inputs[i].value) )?parseFloat(inputs[i].value):0;
sum += (price - cost) * qty;

您需要做的是使用getAttribute()来获取value2,并使用.selectedIndex属性来识别下拉控件中的选定选项。

或者至少这是我的解释。

它在这里工作