我正在使用文本框作为“数量”字段来更新< p>与项目的小计。我有这个工作伟大的我的while循环(PHP)中的第一项。但是,每个连续项目都不会调整范围。
我的PHP:
<?php $furniture = mysql_query("SELECT * FROM tbl_furniture WHERE furniture_active = '1'");
while($row = mysql_fetch_array($furniture))
{
?>
<div class="one-third column">
<h3><img src="images/<?php echo $row['furniture_image1'];?>" width="300" height="300"></h3>
<?php $furniture_price = $row['furniture_price'];
$furniture_id = $row['furniture_id'];?>
<div id="content">
<table width="100%" border="0">
<tr>
<td class="price">
<p class="furn_itemprice" id="price">£<?php echo $furniture_price;?></p><input name="price[]" type="hidden" value="<?php echo $furniture_price;?>"><input name="furniture_id[]" type="hidden" value="<?php echo $furniture_id;?>">
</td>
<td class="quantity">
<input name="qty[]" type="text" id="quantity" value="" class="calc"/><br />
</td>
</tr>
</table>
<br />
<p class="totals" id="subtotal">Sub-total:</p>
</div>
</p>
<?php } ?>
javascript函数看起来像这样:
var stock = {}
window.onload=function() {
var inputs = document.getElementsByTagName('input');
for (var i=0;i<inputs.length;i++) {
if (inputs[i].type=="text" && inputs[i].id.indexOf('quantity')!=-1) {
var name = inputs[i].id.replace('quantity','');
stock[name] = parseFloat(document.getElementById('price').innerHTML.replace('£',''))
inputs[i].onchange=function() {
var total = 0;
for (var furn_item in stock) {
var q = document.getElementById("quantity").value;
total += (isNaN(q) || q=="")?0:parseInt(q)*stock[furn_item]
}
document.getElementById('subtotal').innerHTML="Sub-total: £"+total.toFixed(2);
}
}
}
}
我不确定我需要做什么,但我认为问题出现在Sub-total:
没有唯一的id / name?
答案 0 :(得分:1)
你可以给每个元素一个唯一的ID,如:
<?php $furniture = mysql_query("SELECT * FROM tbl_furniture WHERE furniture_active = '1'");
$i=0 // init counter
while($row = mysql_fetch_array($furniture))
{...
...
<p class="furn_itemprice" id="price<?php echo $i++;?>">£<?php ec... // append counter to element id
...
和
var q = document.getElementById("quantity"+i).value;
此外,您不应将mysql*
用于新代码,而是由mysqli*
我个人更喜欢PDO
用于php数据库连接
答案 1 :(得分:1)
如评论中所述,您的代码会生成多个具有相同ID的HTML元素。 id必须在整个页面上是唯一的。这就是你的代码不起作用的原因。
您想要实现的是为每一行/每件家具提供不同的ID,并相应地绑定JavaScript处理程序。使用jQuery更容易。您可以创建具有包含价格的属性的数量字段:
<input name="qty[]" type="text" data-price="<?php echo $furniture_price;?>" value="" class="quantity"/>
然后,在jQuery中,您可以获得具有类数量的所有元素:
var sum = 0;
$(".quantity").each(function() {
sum += $(this).val() * $(this).attr('data-price');
});
$("#subtotal").text(sum);
所以,你可以在没有jQuery的情况下实现类似的东西。我希望这能让你了解如何解决问题。