简单的购物车
学js不久 做了一个简易 购物车 不要嘲笑哦
购物车 可以实现 全选 ，选中了之后，价格自动增加 而且可以选择数量 如果 输入的不是正整数的时候 还会警告 全选的内容提供超链接和 复选框两种方式
<html><meta http-equiv="content-type" content="text/html;charset=utf-8"/><head><script language="javascript" type="text/javascript"> <!-- function shopping(obj){ //此时的fruits是一个数组 var fruits=document.getElementsByName("fruit"); var fruitnum=document.getElementsByName("fruitnum"); //另外定义一个数量 不要直接用 或的的数量 var num=1; //总价格 var totlePrice=0; for(i=0;i<fruits.length;i++){ if(fruits[i].checked){ //在根据数量算总价格 //window.alert(fruitnum[i].value); //先判断一下数量值是否为空 如果为空 则 默认为1 if(fruitnum[i].value=="") { num=1; } else { num=parseInt(fruitnum[i].value); } //算总价格 totlePrice+=(parseInt(fruits[i].value)*num); } } myspan.innerText=totlePrice; }//全选的函数function allselect(obj){ var fruits=document.getElementsByName("fruit"); if(obj.innerText=="全选"){ for(j=0;j<fruits.length;j++){ fruits[j].checked=true; } } else if(obj.innerText=="取消"){ for(j=0;j<fruits.length;j++){ fruits[j].checked=false; } }//这里在调用一下这个函数 因为这个函数默认是在 onclick下执行的 所以这里 不调用的话 会没有效果的shopping(obj);}//复选框全选用的function allselect2(obj){ var check=document.getElementsByName("check"); var fruits=document.getElementsByName("fruit"); if(check[0].checked){ for(j=0;j<fruits.length;j++){fruits[j].checked=true; } } else { for(j=0;j<fruits.length;j++){fruits[j].checked=false; } }shopping(obj);}//数量选择function num(obj){ if(obj.keyCode<48||obj.keyCode>57){ window.alert("输入值非法，重新输入"); return false;} } //--></script></head><body><h1>我的购物车</h1><input type="checkbox" value="10" name="fruit" onclick="shopping(this)"/>苹果10元 数量<input type="text" value="1" name="fruitnum" size="10" onkeypress="return num(event)" onkeyup="shopping(this)" /><br/><input type="checkbox" value="20" name="fruit" onclick="shopping(this)"/>橘子20元 数量<input type="text" value="1" name="fruitnum" size="10" onkeypress="return num(event)" onkeyup="shopping(this)" /><br/><input type="checkbox" value="30" name="fruit" onclick="shopping(this)"/>栗子30元 数量<input type="text" value="1" name="fruitnum" size="10" onkeypress="return num(event)" onkeyup="shopping(this)" /><br/><input type="checkbox" value="40" name="fruit" onclick="shopping(this)"/>香蕉40元 数量<input type="text" value="1" name="fruitnum" size="10" onkeypress="return num(event)" onkeyup="shopping(this)" /><br/><input type="checkbox" value="50" name="fruit" onclick="shopping(this)"/>枣子50元 数量<input type="text" value="1" name="fruitnum" size="10" onkeypress="return num(event)" onkeyup="shopping(this)" /><br/>总价格是<span id="myspan">0</span>元<br/><a href="#" onclick="allselect(this)">全选</a> <a href="#" onclick="allselect(this)">取消</a><br/><!--复选框的 全选--><input type="checkbox" onclick="allselect2(this)" name="check"/>全选<br/></body></html>