Javascript jQuery，表单中的变量数学

我正在尝试制作一个表格，根据选择的选项计算出某件东西的价格。我已经成功地将其用于3个选项，但我不知道如何使其创建小计，此小计应添加变量“vpageprice”和“vmediaprice”，并显示在id为“st”的单元格内。下面是我的代码，这是一个

HTML

我希望有人能帮助我解决这个问题，如果有人有更好/更简单的方法来制作这个表格，我会改变我所拥有的。非常感谢。

以下是解决方案：

$("#form").change(function() {
    $("#st").text("$" + (pageprice()+mediaprice()));
}).change();

$(document).ready(function(){

function mediaprice() {
  var vmediaprice = $("#media").val();
  $("#mp" ).html("£"+vmediaprice);
  return parseFloat(vmediaprice);
}
function pageprice() {
  var vpageprice = ($("#pages").val())*($("#pagestyle").val());
  $("#pp" ).html("£"+vpageprice);
  return parseFloat(vpageprice);
}    
function pagestyleprice() {
  var vpagestyleprice = $("#pagestyle").val();
  $("#ps" ).html("£"+vpagestyleprice+" per page");
  return parseFloat(vpagestyleprice);
}

function updateAll(){
    var total = mediaprice() + pageprice(); //Order here affects
    $("#st" ).html("£"+total);
}    

$("#form").change(updateAll);
updateAll();

});

---

下面是一个非常简单的解决方案：

$("#form").change(function() {
    $("#st").text("$" + (pageprice()+mediaprice()));
}).change();

$(document).ready(function(){

function mediaprice() {
  var vmediaprice = $("#media").val();
  $("#mp" ).html("£"+vmediaprice);
  return parseFloat(vmediaprice);
}
function pageprice() {
  var vpageprice = ($("#pages").val())*($("#pagestyle").val());
  $("#pp" ).html("£"+vpageprice);
  return parseFloat(vpageprice);
}    
function pagestyleprice() {
  var vpagestyleprice = $("#pagestyle").val();
  $("#ps" ).html("£"+vpagestyleprice+" per page");
  return parseFloat(vpagestyleprice);
}

function updateAll(){
    var total = mediaprice() + pageprice(); //Order here affects
    $("#st" ).html("£"+total);
}    

$("#form").change(updateAll);
updateAll();

});

这是一个解决方案：

$("#form").change(function() {
    $("#st").text("$" + (pageprice()+mediaprice()));
}).change();

$(document).ready(function(){

function mediaprice() {
  var vmediaprice = $("#media").val();
  $("#mp" ).html("£"+vmediaprice);
  return parseFloat(vmediaprice);
}
function pageprice() {
  var vpageprice = ($("#pages").val())*($("#pagestyle").val());
  $("#pp" ).html("£"+vpageprice);
  return parseFloat(vpageprice);
}    
function pagestyleprice() {
  var vpagestyleprice = $("#pagestyle").val();
  $("#ps" ).html("£"+vpagestyleprice+" per page");
  return parseFloat(vpagestyleprice);
}

function updateAll(){
    var total = mediaprice() + pageprice(); //Order here affects
    $("#st" ).html("£"+total);
}    

$("#form").change(updateAll);
updateAll();

});

在此处工作：

EDIT更好地考虑您的逻辑，这将是

updateAll

方法：

 function updateAll(){
    pagestyleprice();
    var total = mediaprice() + pageprice(); //Order here affects
    $("#st" ).html("£"+total);
 }

在这里工作：

---

干杯

Pagestyleprice是pageprice不加的倍。因此，该错误也存在于原始代码中。我刚刚使用了你的代码“var vpageprice=（$（“#pages”）.val（））*（$（“#pagestyle”）.val（））；“我的代码中肯定有很多次。呵呵，看看你的pageprice函数和我的，它们都是倍数。我的意思是在“function updateAll”中，它把它们加在一起，在应该乘以它们的地方。如果你能使这个等式与时间一致，那么我会接受你的答案，因为它消除了我以前的一些代码。这很有效，谢谢。问：为什么parseInt的末尾有10？它是基数，必须定义它以避免解析数字可能出现的问题。例如，parseInt（“0700”）//448或parseInt（“0700”，10）//700Ahh，这是为了使它成为十进制，与二进制或十六进制等替代数字系统类似？感谢您的回答并帮助我理解其背后的代码：D这符合我的要求，但正如前面所述，它的页面样式*页面价格不正，因此等式是错误的。如果你能把这个方程式做对，我会接受你的答案，因为它比其他答案简单。谢谢你的编辑，但我对代码有另一个问题，在点击选项之前，总价不会出现，你能补救吗？