javascript无法启动或从函数返回结果

Question

我有这个功能，它应该在选择菜单中返回税款、总额和税前总额。这是函数：

var select = document.getElementById('entre');

select.addEventListener('change', function() {
  taxesrepas(select.value);
});

function taxesrepas(option) {
  var soustot = 0,
    taxes = 0,
    total = 0,
    soustot = 0;


  if (option == "spaghetti") {
    total += 9.62;
    taxes += 0.67;
    soustot += 8.95;
  }
  if (option == "lasagne") {
    total += 10.70;
    taxes += 0.75;
    soustot += 9.95;
  }

  if (option == "salade") {
    total += 6.30;
    taxes += 0.45;
    soustot += 5.95;
  }
  if (option == "escargot") {
    total += 5.32;
    taxes += 0.37;
    soustot += 4.95;
  }

    document.getElementById("taxes").innerHTML = taxes;
    document.getElementById("total").innerHTML = total;
    document.getElementById("soustotal").innerHTML = soustot;

}

我想在这些标签中返回结果，但它们根本不会返回。另外我不知道如何启动该功能，我尝试使用 onchange/onload，但没有任何返回！

<h3>taxes:</h3><span id="taxes"></span>
<h3>Sous-total:</h3><span id="soustot"></span>
<h3>Total:</h3><span id="total"></span>

感谢您的帮助

EDIT1：选择选项来自 2 个单独的菜单，其中千层面/意大利面放在一起，沙拉/蜗牛放在另一个菜单中。我需要这个函数来添加价格和税金并在那些 h3 中打印。

这里有 2 个选择菜单：

<select name="repas" id="entree2" onChange="changerepas(this.value)">
    <option value="hidden1" selected>Choisir...</option>
    <option value="spaghetti">Spaghetti</option>
    <option value="lasagne">Lasagne</option>
  </select>

<select name="entree" id="entree3" onChange="changeit(this.value)">
    <option value="hidden" selected>Choisir...</option>
    <option value="salade">Salade</option>
    <option value="escargot">Escargot</option>
  </select>

Answer 1

只是基于你的一个小例子，你在初始化变量上遇到了一些问题......问候。

document.querySelector('select').addEventListener('change', function() {
  taxesrepas(this.value);
});

https://codepen.io/anon/pen/OxjjYv