我想将数据添加到表中,将文本拆分为数组。当我点击添加按钮时,数据出现在表格中,并自动将价格和金额乘以总价。谁能帮帮我?
这是html
<div class="container">
<div class="form" style="margin-top: 50px;">
<div class="form">
<div class="form-group">
<label for="inputEmail3">Input</label>
<div class="">
<input type="text" class="form-control" id="transaction" placeholder="Input Transaction">
</div>
</div>
<div class="form-group">
<div>
<button type="submit" class="btn btn-default" onclick="addTransaction()">Add</button>
</div>
</div>
</div>
</div>
<div class="row">
<table id="table_trans" class="table table-bordered">
<thead>
<tr>
<th>Name</th>
<th>Price</th>
<th>Amount</th>
<th>Total Price</th>
</tr>
</thead>
<tbody>
</tbody>
<tfoot>
<tr>
<td colspan="3">
<input type="button" value="Total Price" class="btn btn-success" id="sumTransaction()"/>
</td>
<td id="area_total"></td>
</tr>
</tfoot>
</table>
</div>
</div>
<!-- /.container -->
这是分割函数
function addRow(tags){
var theTable = document.getElementById('table_trans').getElementsByTagName('tbody')[0];
var newRow = theTable.insertRow(-1);
var newCell, theText, i;
for(i=0;i<tags.length;i++){
newCell = newRow.insertCell(i);
theText = document.createTextNode(tags[i]);
newCell.appendChild(theText);
}
}
function addTransaction(){
var inputTags = document.getElementById('transaction').value;
addRow(inputTags.split(','));
}
最佳答案
如本 codepen ,我将字符串传递给 addRow
和 split()
那里,取 Price
并将其乘以 Amount
获取 Total
,然后将 Total
的值附加到 tags
数组:
function addRow(tags) {
tags = tags.split(',');
var total = tags[1] * tags[2];
tags.push(total);
var theTable = document.getElementById('table_trans').getElementsByTagName('tbody')[0];
var newRow = theTable.insertRow(-1);
var newCell, theText, i;
for (i = 0; i < tags.length; i++) {
newCell = newRow.insertCell(i);
theText = document.createTextNode(tags[i]);
newCell.appendChild(theText);
}
}
function addTransaction() {
var inputTags = document.getElementById('transaction').value;
addRow(inputTags);
}
<div class="container">
<div class="form" style="margin-top: 50px;">
<div class="form">
<div class="form-group">
<label for="inputEmail3">Input</label>
<div class="">
<input type="text" class="form-control" id="transaction" placeholder="Input Transaction">
</div>
</div>
<div class="form-group">
<div>
<button type="submit" class="btn btn-default" onclick="addTransaction()">Add</button>
</div>
</div>
</div>
</div>
<div class="row">
<table id="table_trans" class="table table-bordered">
<thead>
<tr>
<th>Name</th>
<th>Price</th>
<th>Amount</th>
<th>Total Price</th>
</tr>
</thead>
<tbody>
</tbody>
<tfoot>
<tr>
<td colspan="3">
<input type="button" value="Total Price" class="btn btn-success" id="sumTransaction()" />
</td>
<td id="area_total"></td>
</tr>
</tfoot>
</table>
</div>
</div>
<!-- /.container -->
关于javascript - 如何从拆分数组函数中乘以数据,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33747915/