使用Javascript选择html表中的文本
我有一个带有“select_tag”字段的HTML表格,我希望有另一个字段接收选择的选项,然后乘以另一个价格数字以显示总数。这是表格:使用Javascript选择html表中的文本,javascript,html-table,Javascript,Html Table,我有一个带有“select_tag”字段的HTML表格,我希望有另一个字段接收选择的选项,然后乘以另一个价格数字以显示总数。这是表格: <table> <tr> <td>(select_tag)</td> <td>price</td> <td>total</td> </tr> </table> (选择标签) 价
<table>
<tr>
<td>(select_tag)</td>
<td>price</td>
<td>total</td>
</tr>
</table>
(选择标签)
价格
全部的
我该怎么做呢?我不知道乘以什么,但是如果你想乘以一个数量“total”的意思,这段代码应该可以工作:
<script type="text/javascript">
price = [];
price[0] = 10000;
price[1] = 20000;
price[2] = 30000;
price[3] = 40000;
</script>
<table>
<tr>
<td><select id="select" onchange="document.getElementById('price').innerHTML = price[document.getElementById('select').value]; document.getElementById('total').innerHTML = price[document.getElementById('select').value] * document.getElementById('qt').value; ">
<option value="0">Volvo</option>
<option value="1">Saab</option>
<option value="2">Mercedes</option>
<option value="3">Audi</option>
</select></td>
<td>
<input type="text" id="qt" onchange="document.getElementById('total').innerHTML = price[document.getElementById('select').value] * document.getElementById('qt').value;" value="1">
</td>
<td id="price">Price</td>
<td id="total">total</td>
</tr>
</table
价格=[];
价格[0]=10000;
价格[1]=20000;
价格[2]=30000;
价格[3]=40000;
沃尔沃汽车
萨博
梅赛德斯
奥迪
价格
全部的
我的答案类似于@pythonFoo,但我假设了一个静态价格,并将JS与HTML分开:
HTML:
您可以在页面的
标记下的
标记中包含JavaScript
请参见此处的工作示例:为了好玩,请参见我的库(最初是7年前编写的!)。第一个示例使用一个select并在另一个字段发生变化时自动更新它。是我能想到的最简单的方法…我的函数支持多个TR,不依赖ID或jQuery…等等(即使我更喜欢jQuery)共同的价格是什么?
<table>
<tr>
<td>
<select id="quantity">
<option value="1">1</option>
<option value="2">2</option>
<option value="5">5</option>
</select>
</td>
<td>price: <span id="price">$2.50</span></td>
<td>total: <span id="total">$2.50</span></td>
</tr>
</table>
var quantitySelect = document.getElementById("quantity");
var priceStr = document.getElementById("price").innerHTML;
var price = parseFloat(priceStr.substring(1), 10);
quantitySelect.onchange = function() {
var quantity = parseInt(this.value, 10);
var total = document.getElementById("total");
var computedTotal = price * quantity;
total.innerHTML = "$" + computedTotal.toFixed(2);
};