<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<p>
<button type="button">-</button>
<span>0</span>
<button type="button">+</button>
单价 : <strong>24</strong>元
小计 : <i>0</i>元
</p>
<p>
<button type="button">-</button>
<span>0</span>
<button type="button">+</button>
单价 : <strong>34</strong>元
小计 : <i>0</i>元
</p>
<p>
<button type="button">-</button>
<span>0</span>
<button type="button">+</button>
单价 : <strong>74</strong>元
小计 : <i>0</i>元
</p>
<p>
<button type="button">-</button>
<span>0</span>
<button type="button">+</button>
单价 : <strong>54</strong>元
小计 : <i>0</i>元
</p>
<hr>
<div id="box">
总件数：<span>0</span>个
最高单价：<span>0</span>元
总计：<span>0</span>元
</div>
<script type="text/javascript">
var aP = document.getElementsByTagName('p');
var oBox = document.getElementById('box');
var oCounts = oBox.getElementsByTagName('span')[0];
var oPrice = oBox.getElementsByTagName('span')[1];
var oTotal = oBox.getElementsByTagName('span')[2];
for(var i = 0;i <aP.length;i++){
tab(aP[i]);
}
var max = 0;
function tab(obj){
var oBtn1 = obj.getElementsByTagName('button')[0];
var oBtn2 = obj.getElementsByTagName('button')[1];
var oSpan = obj.getElementsByTagName('span')[0];
var oStrong = obj.getElementsByTagName('strong')[0];
var oI = obj.getElementsByTagName('i')[0];
oBtn1.onclick = function(){
if(oSpan.innerHTML == '0'){
return;
}
oSpan.innerHTML = Number(oSpan.innerHTML) - 1;
// 计算小计
oI.innerHTML = oSpan.innerHTML * oStrong.innerHTML;
oCounts.innerHTML = Number(oCounts.innerHTML)-1;
oTotal.innerHTML = (Number(oTotal.innerHTML) -Number(oStrong.innerHTML)).toFixed(2);
findMax();
oPrice.innerHTML = max;
}
oBtn2.onclick = function(){
oSpan.innerHTML = Number(oSpan.innerHTML) + 1;
// 计算小计
oI.innerHTML = oSpan.innerHTML * oStrong.innerHTML;
oCounts.innerHTML = Number(oCounts.innerHTML)+1;
oTotal.innerHTML = (Number(oTotal.innerHTML) + Number(oStrong.innerHTML)).toFixed(2);
if(max < Number(this.nextElementSibling.innerHTML)){
max = Number(this.nextElementSibling.innerHTML);
oPrice.innerHTML = max;
}
}
function findMax(){
arr= [];
max = 0;
for(var i = 0;i<aP.length;i++){
var oSpan0 = aP[i].getElementsByTagName('span')[0];
var oStrong0 = aP[i].getElementsByTagName('strong')[0];
if(Number(oSpan0.innerHTML) >0 ){
arr.push(Number(oStrong0.innerHTML));
}
}
for(var i = 0;i<arr.length;i++){
if(max<arr[i]){
max = arr[i];
}
}
}
}
</script>
</body>
</html>
网友评论