Javascript 在旧 Windows Firefox 上失败
Javascript fails on old Windows Firefox
我构建了一个订单查询表单,其中包含一些 Javascript 驱动的功能。我已经在我可以测试的每个浏览器上使用了此表单,即 Win 10 和一些 Mac 操作系统。我的客户仍在使用 Windows XP,他说这两个功能不起作用:
使用单选按钮选项提高商品价格
收集全部后在页面底部计算小计
各种商品的价格和数量。
在我告诉他我不能支持 XP 之前,我想知道我的脚本中是否有已知的某些东西在 Windows XP 上的 Firefox 中会失败(希望有解决方法)。我已经在线检查了方法文档,但没有看到。这是我正在使用的各种脚本。这些都是纯粹的Javascript,就是看我能不能做到。
每次项目数量变化时都会触发小计重新计算。
/************************************************
* Wide Option
************************************************/
function subtractWideOption() { // below traverse DOM from radio button to price
var priceSpan = event.target.parentNode.parentNode.nextElementSibling.firstElementChild;
if (priceSpan.className.indexOf("wider") !== -1) { // test if option is already set
var currentPrice = parseInt(priceSpan.innerHTML.slice(1), 10); // remove $ sign and parse
var newPrice = currentPrice - 25; // remove cost for option
priceSpan.innerHTML = "$" + newPrice; // add $ sign
priceSpan.className = priceSpan.className.replace(" wider",""); // remove option class
priceSpan.className += " std"; // add standard class
} else {
return;
}
}
function addWideOption() {
var priceSpan = event.target.parentNode.parentNode.nextElementSibling.firstElementChild;
if (priceSpan.className.indexOf("std") !== -1) {
var currentPrice = parseInt(priceSpan.innerHTML.slice(1), 10);
var newPrice = currentPrice + 25;
priceSpan.innerHTML = "$" + newPrice;
priceSpan.className = priceSpan.className.replace(" std","");
priceSpan.className += " wider";
} else {
return;
}
}
/************************************************
* Order Subtotal
************************************************/
var qtyBtns = document.getElementsByClassName("qty"); // collect all qty inputs
var subTotal = document.getElementById("oi_subt");
function recalcSubtotal() {
var subT = 0;
for (var i = 0; i < qtyBtns.length; i++) { // below traverse DOM from input to price
var priceHTML = qtyBtns[i].parentNode.previousElementSibling.firstElementChild.innerHTML;
if (priceHTML == "TBD") { // one custom item with TBD price is ignored
price = "0"
} else {
priceHTML = priceHTML.replace(",",""); // remove comma from price
var price = parseInt(priceHTML.slice(1), 10); // remove $ sign and parse
};
var qty = parseInt(qtyBtns[i].value, 10);
subT += (price * qty); // add up all items ordered
subTotal.innerHTML = "$" + subT;
}
}
您正在像这样绑定您的事件处理程序:
var stepupBtns = document.getElementsByClassName("steppingUp");
for (var i = 0; i < stepupBtns.length; i++) {
stepupBtns[i].onclick = function(){
var valueOf = this.previousElementSibling.value;
valueOf = ++valueOf;
this.previousElementSibling.value = valueOf;
event.preventDefault();
recalcSubtotal();
}
}
在这些函数中,请注意 event
变量未在任何地方定义。事件变量应在您的函数定义中传递:
stepupBtns[i].onclick = function(event){
您应该对所有处理程序执行此操作。
可在此处找到更多信息:
我构建了一个订单查询表单,其中包含一些 Javascript 驱动的功能。我已经在我可以测试的每个浏览器上使用了此表单,即 Win 10 和一些 Mac 操作系统。我的客户仍在使用 Windows XP,他说这两个功能不起作用:
使用单选按钮选项提高商品价格
收集全部后在页面底部计算小计 各种商品的价格和数量。
在我告诉他我不能支持 XP 之前,我想知道我的脚本中是否有已知的某些东西在 Windows XP 上的 Firefox 中会失败(希望有解决方法)。我已经在线检查了方法文档,但没有看到。这是我正在使用的各种脚本。这些都是纯粹的Javascript,就是看我能不能做到。
每次项目数量变化时都会触发小计重新计算。
/************************************************
* Wide Option
************************************************/
function subtractWideOption() { // below traverse DOM from radio button to price
var priceSpan = event.target.parentNode.parentNode.nextElementSibling.firstElementChild;
if (priceSpan.className.indexOf("wider") !== -1) { // test if option is already set
var currentPrice = parseInt(priceSpan.innerHTML.slice(1), 10); // remove $ sign and parse
var newPrice = currentPrice - 25; // remove cost for option
priceSpan.innerHTML = "$" + newPrice; // add $ sign
priceSpan.className = priceSpan.className.replace(" wider",""); // remove option class
priceSpan.className += " std"; // add standard class
} else {
return;
}
}
function addWideOption() {
var priceSpan = event.target.parentNode.parentNode.nextElementSibling.firstElementChild;
if (priceSpan.className.indexOf("std") !== -1) {
var currentPrice = parseInt(priceSpan.innerHTML.slice(1), 10);
var newPrice = currentPrice + 25;
priceSpan.innerHTML = "$" + newPrice;
priceSpan.className = priceSpan.className.replace(" std","");
priceSpan.className += " wider";
} else {
return;
}
}
/************************************************
* Order Subtotal
************************************************/
var qtyBtns = document.getElementsByClassName("qty"); // collect all qty inputs
var subTotal = document.getElementById("oi_subt");
function recalcSubtotal() {
var subT = 0;
for (var i = 0; i < qtyBtns.length; i++) { // below traverse DOM from input to price
var priceHTML = qtyBtns[i].parentNode.previousElementSibling.firstElementChild.innerHTML;
if (priceHTML == "TBD") { // one custom item with TBD price is ignored
price = "0"
} else {
priceHTML = priceHTML.replace(",",""); // remove comma from price
var price = parseInt(priceHTML.slice(1), 10); // remove $ sign and parse
};
var qty = parseInt(qtyBtns[i].value, 10);
subT += (price * qty); // add up all items ordered
subTotal.innerHTML = "$" + subT;
}
}
您正在像这样绑定您的事件处理程序:
var stepupBtns = document.getElementsByClassName("steppingUp");
for (var i = 0; i < stepupBtns.length; i++) {
stepupBtns[i].onclick = function(){
var valueOf = this.previousElementSibling.value;
valueOf = ++valueOf;
this.previousElementSibling.value = valueOf;
event.preventDefault();
recalcSubtotal();
}
}
在这些函数中,请注意 event
变量未在任何地方定义。事件变量应在您的函数定义中传递:
stepupBtns[i].onclick = function(event){
您应该对所有处理程序执行此操作。
可在此处找到更多信息: