[英]Calculator Not Working in other browsers
I have a calculator function that works well in chrome but not in other browsers (edge,firefox,explorer,opera). 我有一个计算器功能,该功能在chrome浏览器中效果很好,但在其他浏览器(edge,firefox,explorer,opera)中却无法使用。 Can anyone tell me what's wrong.Thanks
谁能告诉我怎么了。
<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>
$('#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();
I am building a table for a ticket purchasing website 我正在为购票网站建立一张桌子
For some reason oninput
is not fired in edge browser. 由于某些原因,在边缘浏览器中不会触发
oninput
。
To fix it, you can add calculate function to end of click
handler, so you will recalculate the sum after click. 要解决此问题,您可以将计算功能添加到
click
处理程序的末尾,因此您将在点击后重新计算总和。
Your code become: 您的代码变为:
$('.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();
});
And you can remove oninput
from your HTML elements. 您可以从HTML元素中删除
oninput
。
At least for FireFox, it is enough to change: 至少对于FireFox而言,更改就足够了:
<select oninput="calculate()" id="titotal" class="titotal">
To: 至:
<select onchange="calculate()" id="titotal" class="titotal">
And it works. 而且有效。 The button is not even necessary then.
那时甚至不需要按钮。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.