炽火狂焰
2018-12-30 22:53
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<title>购物车</title>
<link rel="stylesheet" type="text/css" href="css/zone.css" />
<link rel="stylesheet" type="text/css" href="css/gouwu.css" />
</script>
</head>
<body>
<div class="layout">
<div class="name">
<h4>购物车</h4>
</div>
<div class="goods">
<span class="checkbox"><input type="checkbox"></span>
<div class="img"><img src="img/gouwu02.png"></div>
<div class="gouwu">
<a href="">欧式别样悬挂台灯</a>
<select>
<option value="">乳白色</option>
<option value="">黄色</option>
<option value="">黑色</option>
<option value="">红色</option>
</select>
<span id="money">1500</span>
</div>
</div>
<div class="goods">
<span ><input type="checkbox"></span>
<div class="img"><img src="img/gouwu03.png"></div>
<div class="gouwu">
<a href="">小清新单人沙发</a>
<select>
<option value="">乳白色</option>
<option value="">黄色</option>
<option value="">黑色</option>
<option value="">红色</option>
</select>
<span id="money">500</span>
</div>
</div>
<div class="goods">
<span class="checkbox"><input type="checkbox"></span>
<div class="img"><img src="img/gouwu04.png"></div>
<div class="gouwu">
<a href="">多功能书桌台</a>
<select>
<option value="">暗灰色色</option>
<option value="">黄色</option>
<option value="">黑色</option>
<option value="">红色</option>
</select>
<span id="money">2500</span>
</div>
</div>
<div class="goods">
<span class="checkbox"><input type="checkbox"></span>
<div class="img"><img src="img/gouwu01.png"></div>
<div class="gouwu">
<a href="">小清新凳子</a>
<select>
<option value="">深蓝色</option>
<option value="">黄色</option>
<option value="">黑色</option>
<option value="">红色</option>
</select>
<span id="money">50</span>
</div>
</div>
</div>
<div class="pay">
<div class="sum">合计:<span id="price">0.00</span></div>
<a class="p_pay">结算</a>
</div>
<footer>
<ul>
<li><img src="img/ft1.png"><br>
<a href="index.html">首页</a>
</li>
<li><img src="img/ft2.png"><br>
<a href="huati.html">话题</a>
</li>
<li><img src="img/ft3s.png"><br>
<a href="gouwu.html" style="color: #4f84ae;">购物车</a>
</li>
<li><img src="img/ft4.png"><br>
<a href="my.html">我的</a>
</li>
</ul>
</footer>
</body>
</html>
<script>
window.onload = function() {
var getgs = document.getElementsByClassName("goods");
var getck = getgs.getElementsByTagName("input");
var getmy = getgs.getElementById("money");
var getpr = document.getElementById("price");
//jisuan
function gettotal () {
var getsum = 0;
if (var j = 0, len = getgs.length; j < len ; j++) {
if (getgs[j].getElementsByTagName("input").checked){
getsum += parseInt([i].getElementsByid(getmy).innerHTML);
}
}
getpr.innerHTML = getsum;
}
if (var i = 0 ,len = getck.length; i < len ; i++) {
getck[i].onclick = function(){
gettotal();
}
}
}
</script>
那是for循环 你写的if
用JS实现购物车特效
43235 学习 · 167 问题
相似问题