javascript自动计算总价

badppgk 2010-04-08 11:19:31

我做一个购物车，想计算每件商品的价格！当输入数量时，就会自动计算出小计，然后再把所有的小计加起来算出总计..这样可行吗？？我做的都显不到结果的！都是显示NaN...请教各位高手如何写才能实现这个功能！
表单： <td>
<input type="text" id="saleprice" name="saleprice" value="${cart.saleprice}"><br>
</td>
<td>
<input type="text" id="count" size="5" name="count" value="1"><br>
</td>
<td>
<input type="text" id="total" size="5" name="total" "><br>
</td>
小计总价是<input type="text" id="alltotal" name="alltotal" onblur="">
求个javascript代码，参考一下！
还有我的saleprice的值是固定的！用户只需输入数量就可以计算小计和总计！

...全文

1202 17 打赏收藏转发到动态举报

写回复

用AI写文章

17 条回复

切换为时间正序

请发表友善的回复…

发表回复

老米 2011-02-26

打赏
举报

试了下，可惜的是以上代码均不能兼容Firefox啊.

badppgk 2010-04-11

打赏
举报

[Quote=引用 13 楼 licip 的回复:]
http://download.csdn.net/source/1908034
这个你去看看，会对你有收获的。
[/Quote]
请问你有没有订单的呀？？？购物车到订单...

zhyzdl 2010-04-11

打赏
举报

学习中。。

pzzer 2010-04-11

打赏
举报

学习中。。

licip 2010-04-09

打赏
举报

http://download.csdn.net/source/1908034
这个你去看看，会对你有收获的。

badppgk 2010-04-09

打赏
举报

还是NaN的...

zyzy15 2010-04-08

打赏
举报



 <style>

 input {width:80px; text-align:right;}

 </style>

<TABLE>

<TR>

	<th>单价</th> 

	<th>数量</th>

	<th>小计</th>

</TR>

<TR>

	<td><input type="text" id="saleprice1" name="saleprice" value="5.5" disabled></td>

	<td><input type="text" id="count1" name="count" value="1" onchange="sum(this)"></td>

	<td><input type="text" id="total1" name="total" disabled></td>

</TR>

<TR>

	<td><input type="text" id="saleprice2" name="saleprice" value="2" disabled></td>

	<td><input type="text" id="count2" name="count" value="1" onchange="sum(this)"></td>

	<td><input type="text" id="total2" name="total" disabled></td>

</TR>

<TR>

	<td colspan="2" align="center">总价是</td>

	<td><input type="text" id="alltotal" name="alltotal" disabled></TD>

</TR>

</TABLE>

<SCRIPT LANGUAGE="JavaScript">

<!--

	init();

	//初始化

	function init(){

		for (var i=0; i<document.getElementsByName("count").length; i++){

			sum(document.getElementsByName("count")[i]);

		}

		all();

	}

	function sum(obj){

		var pri = obj.parentElement.previousSibling.childNodes[0].value;

		var tot = obj.parentElement.nextSibling.childNodes[0];

		tot.value = parseFloat(pri) * parseInt(obj.value,10);

		all();

	}

	//算总价

	function all() {

		var alltot = 0;

		for (var i=0; i<document.getElementsByName("total").length; i++){

			alltot += parseFloat(document.getElementsByName("total")[i].value);

		}

		document.getElementById("alltotal").value = alltot;

	}

//-->

</SCRIPT>

shan1119 2010-04-08

打赏
举报

 <TABLE id="tab1" border="1" bordercolor="#CCCCCC" style="border-collapse:collapse;">

 <TR bgcolor="#FFEEDD">

<td>   

<input type="text" id="saleprice" name="saleprice" value="15"><br> 

</td> 

  <td>   

  <input type="text" id="count" size="5" name="count" value="1" onchange="calc(this);"><br>

</td>

<td>

<input type="text" id="total" size="5" name="total "><br>

</td>

 </TR>

 <TR bgcolor="#FFEEDD">

<td>   

<input type="text" id="saleprice" name="saleprice" value="25"><br> 

</td> 

  <td>   

  <input type="text" id="count" size="5" name="count" value="1" onchange="calc(this);"><br>

</td>

<td>

<input type="text" id="total" size="5" name="total "><br>

</td>

 </TR>

 </TABLE>

<input type="text" id="alltotal" name="alltotal" onblur="">



 <BODY>

  <SCRIPT LANGUAGE="JavaScript">

  function calc(o){

    var tab = document.getElementById("tab1");

    var i=o.parentNode.parentNode.rowIndex;

    

    document.getElementsByName("total")[i].value=

    document.getElementsByName("saleprice")[i].value*

    document.getElementsByName("count")[i].value;

    

    document.getElementsByName("alltotal")[0].value=0

    for(var r=0;r<tab.rows.length;r++)

    document.getElementsByName("alltotal")[0].value=

    parseInt(document.getElementsByName("alltotal")[0].value,10)+

    parseInt(document.getElementsByName("total")[r].value||0)

  }

  </SCRIPT>

badppgk 2010-04-08

打赏
举报

[Quote=引用 1 楼 lianqin7 的回复:]
直接获得的value值是字符串，要转化为数字类型才可以相乘

可以使用

var price = document.getElementById("saleprice");
var count = document.getElementById("count");

parseInt(price.value,10) * parseInt(count.value,10)

或+(p……
[/Quote]
var price = document.getElementById("saleprice").value;呵呵！还是不行的呀！能不能详细一点吗？把计算的代码也给我参考一下吧！我不太善长js...

vnetcbd 2010-04-08

打赏
举报





单件销售额<input type="text" id="count" size="5" name="count" value="100元">

输入你要买的件数<input type="text" id="total" size="5" name="total" onkeyup="this.value=this.value.replace(/\D/g,'')"  onafterpaste="this.value=this.value.replace(/\D/g,'')">

小计总价 是<input type="text" id="alltotal" name="alltotal" onfocus="showprice();" />



<script>

function showprice(){

	var price = document.getElementById("count");

	var count = document.getElementById("total");

	var alltotal = document.getElementById('alltotal');

	alltotal.value = parseInt(price.value,10) * parseInt(count.value,10)+'元' ;

}

千游 2010-04-08

打赏
举报

count = parseInt(count);或
count = count-'0';
转成数字

lianqin7 2010-04-08

打赏
举报

直接获得的value值是字符串，要转化为数字类型才可以相乘

可以使用

var price = document.getElementById("saleprice");
var count = document.getElementById("count");

parseInt(price.value,10) * parseInt(count.value,10)

或+(price.value) * (+(count.value))

lianqin7 2010-04-08

打赏
举报

[Quote=引用 7 楼 badppgk 的回复:]
如果从数据库拿出价格！它的格式会是2，855的，计算的时候会忽略后面的！怎样解决呀？
[/Quote]

var price = document.getElementById("saleprice");
var value = parseInt(price.value.replace(/,/g, ""), 10);

zyzy15 2010-04-08

打赏
举报

[Quote=引用 8 楼 badppgk 的回复:]
这个要写很多次的<td>咯！！我的是遍历的！只有一个input的！
[/Quote]
啥意思？没太懂……
不是多个小计加起来是合计吗，应该每一个小计都是一个input吧……
然后合计是一个input？

badppgk 2010-04-08

打赏
举报

[Quote=引用 6 楼 zyzy15 的回复:]
HTML code

<style>
input {width:80px; text-align:right;}
</style>
<TABLE>
<TR>
<th>单价</th>
<th>数量</th>
<th>小计</th>
</TR>
<TR>
<td><input type="text" id="saleprice1" nam……
[/Quote]
这个要写很多次的<td>咯！！我的是遍历的！只有一个input的！

badppgk 2010-04-08