js代码只能接受收到数据库遍历的第一条数据里面的数据。

Question

想实现改物品数量物品总价也跟着改动，由于不懂JS左查右查勉强实现了效果。但是购物车有两条数据的时候只有第一条有效。
这是下面是代码：

这是js代码

<script>

function myFunction() {

    var x = document.getElementById("myNumber").value;    

    var text=document.querySelector(".goodsprice strong").innerHTML;

    var allprice=text*x+10

    document.getElementById("allprice").innerHTML = allprice;

    

}

</script>

求大神教怎么改，另为js取到这些值怎么传到控制器方法里面去

Answer 1

<volist name='list1' id='vo'>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <tr id="row_{$vo.index}">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <td><img height=80px width=150px src="__PUBLIC__/goods/{$vo.img_address}" alt="13"></td>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <td>{$vo.goods_name}</td>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <td>{$vo.goods_describe}</td>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <td class='goodsprice'><strong>{$vo.goods_price}</strong></td>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <td><input&nbsp; type="number" class="myNumber" name="quantity" min="1" max="500" value='{$vo.goods_count}' onclick='myFunction("#row_{$vo.index}")'></td>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <td><strong id="allprice">{$vo.order_price}</strong></td>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <td><span class="red"><i class="fa fa-times" aria-hidden="true"></i></span></td>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </tr>&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </volist><script>function myFunction(rowIdSelector) {&nbsp; &nbsp; var trRowDOM=document.getElementById(rowIdSelector);&nbsp; &nbsp; var number = pareInt(trRowDOM.querySelector(".myNumber").value,10)||0;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp; var price= parseFloat(trRowDOM.querySelector(".goodsprice strong").innerText)||0.0;&nbsp; &nbsp; var allprice=number*price+10;&nbsp; &nbsp; document.getElementById("allprice").innerHTML = allprice.toFixed(2);&nbsp; &nbsp;&nbsp;}</script>