Question

我有一个适用于Chrome的计算器功能，但在其他浏览器（edge，firefox，explorer，opera）中没有。谁能告诉我什么是错的。谢谢

＆＃13;

<div class="content ticket_wrapper">
  <div class="table">
    <div class="row header">
      <div class="cell">Ticket</div>
      <div class="cell"><div class="align"> Price</div></div>
      <div class="cell"><div class="align"> Qnty</div></div>
      <div class="cell">Total</div>
    </div>
    <div class="row">
      <div class="cell">Normal</div>
      <div class="cell"><div class="align"> KSH 650</div></div>
      <div class="cell">
          <div class="ticket">
            <select oninput="calculate()" id="titotal" class="titotal">
              <option value="0">0</option>
              <option value="1">1</option>
              <option value="2">2</option>
              <option value="3">3</option>
            </select>
          </div>
      </div>
      <div class="cell">
        <span id="result"></span>
      </div>
    </div>
    <div class="row">
      <div class="cell">Advanced</div>
      <div class="cell"><div class="align"> KSH 950</div></div>
      <div class="cell">
          <div class="ticket">
            <select oninput="calculate()" id="titotal_2" class="titotal">
              <option value="0">0</option>
              <option value="1">1</option>
              <option value="2">2</option>
              <option value="3">3</option>
            </select>
          </div>
      </div>
      <div class="cell">
        <span id="result2"></span>
      </div>
    </div>
  </div>
  <div class="table_tots">
    <div class="row grand_total">
        <div class="cell">
            Sub Total : 
            <span id="grand_total"></span>
        </div>
    </div>
  </div>
  <div id="sub"> 
    <input class="submit" type="button" value="Proceed">
  </div>
</div>

＆＃13;

$('#sub').hide();
    $('.titotal').on('click', function(event){
        var one = $('#titotal').val();
        var two = $('#titotal_2').val();
        if (one>0 || two>0) {
            $('#sub').show();
        }else{
            $('#sub').hide();
        }
    });

    function calculate(){
        var mybox1 = document.getElementById('titotal').value;
        var mybox2 = document.getElementById('titotal_2').value;
        var myresult = mybox1 * 650;
        var myresult2 = mybox2 * 950;
        var total = myresult + myresult2;
        document.getElementById("result").innerHTML = myresult;
        document.getElementById("result2").innerHTML = myresult2;
        document.getElementById("grand_total").innerHTML = total;
      }
    window.onload = calculate();

＆＃13;

我正在为购票网站建立一个表格

Answer 1

由于某种原因oninput未在边缘浏览器中触发。

要修复它，您可以将计算功能添加到click处理程序的末尾，所以你会在点击后重新计算总和。

您的代码变为：

 $('.titotal').on('click', function(event){
        var one = $('#titotal').val();
        var two = $('#titotal_2').val();
        if (one>0 || two>0) {
            $('#sub').show();
        }else{
            $('#sub').hide();
        }

        calculate();
    });

您可以从HTML元素中删除oninput。

Here你有一个工作小提琴。

Answer 2

至少对于FireFox来说，改变就足够了：

<select oninput="calculate()" id="titotal" class="titotal">

要：

<select onchange="calculate()" id="titotal" class="titotal">

它有效。那时按钮甚至不需要。

计算器不适用于其他浏览器

2 个答案: