Question

HTML：

<div class="simpleCart_shelfItem">
    <img src="image/frod001.gif" alt="" />
    <p class="item_name">Fishing rod model 001</p>
    <span class="item_price">BND $189.95</span><br/>            
    Qty: <input type="text" class="item_quantity" value="1" style="width:20px;"/><br/>
    <input type="button" onclick="calculateText();" value="add to cart" />
</div>

我是编码和Javascript的新手。我希望按钮工作，但没有PHP，只需Javascript

Answer 1

试试这个http://jsfiddle.net/KgAe4/4/：

<div class="simpleCart_shelfItem">
    <img src="image/frod001.gif" alt="" />
    <p class="item_name">Fishing rod model 001</p>                                  
    <span class="item_price">BND $189.95</span><br/>                                
    Qty: <input type="text" class="item_quantity" value="1" style="width:20px;"/><br/>
    <input type="button" onclick="javascript:calculateText();" id="calculateText" value="add to cart" />                          
</div>

<强>的jQuery

$("#calculateText").on("click", function(){
    var price = $(".item_price").text();
    var priceSplit = price.split("$");
    var realprice = parseFloat(priceSplit[1]);
    alert(realprice);
    var quantity = $(".item_quantity").val();
    alert(realprice*quantity);
});

<强>的Javascript

function calculateText(){
    var price = document.getElementsByClassName("item_price")[0].innerHTML;
    var priceSplit = price.split("$");
    var realprice = parseFloat(priceSplit[1]);
    var quantity = document.getElementsByClassName("item_quantity")[0].value;
    alert(realprice*quantity);
}

Answer 2

修改你的html，将范围改为：

<span class="item_price">BND <label id="price">189.95</label></span><br/>

和js：

function calculateText(){
var price=document.getElementById("price").innerText
var quantity=document.getElementsByClassName("item_quantity")[0].value
var total=price*quantity
alert("total: $"+total)

}

如何通过此表单查看，计算和显示总价？

2 个答案: