Javascript 将表格中的两个单元格相乘

jsFiddle：

我有一个脚本（如下）将一行添加到表中

我想把两个单元格相加得到一个总数

Item Price * Item Weight = Line Total 

if (field.value.length != 0) {
    var upc=document.getElementById("UPC").value;
    var weight=document.getElementById("weight").value +"lbs";
    var table=document.getElementById("ScannedItems");
    var row=table.insertRow(-1);
    var cell1=row.insertCell(0);
    var cell2=row.insertCell(1);
    var cell3=row.insertCell(2);
    var cell4=row.insertCell(3);
    var cell5=row.insertCell(4);
    var cell6=row.insertCell(5);
    cell1.innerHTML=upc;
    cell2.innerHTML="Example Description";
    cell3.innerHTML="$3.00";
    cell4.innerHTML=weight;
    var total=cell3.innterHTML*cell4.innerHTML;
    cell5.innerHTML="$" +total;
    cell6.innerHTML="<a><span class='glyphicon glyphicon-plus' style='padding-right:15px;'></span></a><span>&nbsp;</span><a><span class='glyphicon glyphicon-minus'></span></a>";
    field.value ='';
}

---

首先，您需要从用户输入中解析整数。接下来，你需要乘。然后附加任何单位：

var weight = parseInt(document.getElementById("weight").value);
var price = 3;
var total = weight * price;

//

cell3.innerHTML = "$" + price.toFixed(2);
cell4.innerHTML = weight + "lbs";
cell5.innerHTML = "$" + total.toFixed(2);

---

根据评论进行编辑

通过

getAttribute

和

setAttribute

访问

data attributes

cell5.setAttribute('data-total', total); // caches the total into data

var total = cell5.getAttribute('data-total'); // reads the value

---

我只是指出错误，你可以调试

    var upc=document.getElementById("UPC").value;
    var weight=document.getElementById("weight").value +"lbs"; // here appending lbs to weight
    var table=document.getElementById("ScannedItems");
    var row=table.insertRow(-1);
    var cell1=row.insertCell(0);
    var cell2=row.insertCell(1);
    var cell3=row.insertCell(2);
    var cell4=row.insertCell(3);
    var cell5=row.insertCell(4);
    var cell6=row.insertCell(5);
    cell1.innerHTML=upc;
    cell2.innerHTML="Example Description";
    cell3.innerHTML="$3.00"; // value having $, so maths operation won't work
    cell4.innerHTML=weight; // value having lbs, so maths operation won't work 
    var total=cell3.innterHTML*cell4.innerHTML; // Is not an integer 

你可以试试这样的东西，而不是上面提到的

   var weight=document.getElementById("weight").value;
   var table=document.getElementById("ScannedItems");
   var row=table.insertRow(-1);
   var cell1=row.insertCell(0);
   var cell2=row.insertCell(1);
   var cell3=row.insertCell(2);
   var cell4=row.insertCell(3);
   var cell5=row.insertCell(4);
   var cell6=row.insertCell(5);
   cell1.innerHTML=upc;
   cell2.innerHTML="Example Description";
   cell3.innerHTML="$3.00";
   cell4.innerHTML=weight+"lbs";
   var total=3*weight;

---

a）

innerHTML

返回字符串b）不能将美元和权重相乘，只能将整数/浮点数相乘，因此在添加美元符号等之前需要相乘。我刚刚尝试将

innterHTML

更改为

value

，结果相同

value

也返回字符串，把它转换成一个数字。我该怎么做呢？@JakubMichálek你能把它作为一个答案而不是一个注释吗？把所有的行总数加在一起以得到一个小计怎么样？你可以使用

td

或

substr

上的

数据属性存储数值，然后
parseInt
每次都从
innerHTML
返回它。我尝试了
cell5.data-total=total，它停止加载脚本的其余部分。我将在一分钟后将其放入答案中。我需要一个“运行”小计，这意味着如果我向表中添加另一项，小计将增加，反之亦然，删除一项。
   var weight=document.getElementById("weight").value;
   var table=document.getElementById("ScannedItems");
   var row=table.insertRow(-1);
   var cell1=row.insertCell(0);
   var cell2=row.insertCell(1);
   var cell3=row.insertCell(2);
   var cell4=row.insertCell(3);
   var cell5=row.insertCell(4);
   var cell6=row.insertCell(5);
   cell1.innerHTML=upc;
   cell2.innerHTML="Example Description";
   cell3.innerHTML="$3.00";
   cell4.innerHTML=weight+"lbs";
   var total=3*weight;