想用js做一个秒杀的东东~可是单个拿出来是可以实现的,多个在一起以后寄无法遍历了,而且单个也只能通过行间样式加 onclick才能实现,这是什么原因呢,求大神赐教~
下面是我的代码
html:
<div class="sale_main">
         <li>
             <div class="main_img"><img src="file:///D|/phpStudy/WWW/lyq/Sale/img/4.jpg"/></div>
                <div class="main_text">【京东超市】德国进口 德悠(HANSANU)1L*12盒 部分脱脂纯牛奶 整箱</div>
                <div class="main_num">
                 <div class="main_price">
                     <em>¥</em><span class="sale_price">79</span>
                        <del class="price_original">216</del>
                    </div>
                    <div class="goods_progress">
                     <span class="goods_txt">已售46%</span>
                        <span class="goods_inner">
                         <div class="goos_saled"></div>
                        </span>
                 </div>
                    <dd class="sale_buy" onclick="aa()">立即抢购</dd>
                </div>
            
            </li>
            <li>
             <div class="main_img"><img src="file:///D|/phpStudy/WWW/lyq/Sale/img/4.jpg"/></div>
                <div class="main_text">【京东超市】德国进口 德悠(HANSANU)1L*12盒 部分脱脂纯牛奶 整箱</div>
                <div class="main_num">
                 <div class="main_price">
                     <em>¥</em><span class="sale_price">79</span>
                        <del class="price_original">216</del>
                    </div>
                    <div class="goods_progress">
                     <span class="goods_txt">已售46%</span>
                        <span class="goods_inner">
                         <div class="goos_saled"></div>
                        </span>
                 </div>
                    <dd class="sale_buy" onclick="aa()">立即抢购</dd>
                </div>
            
            </li>
           </div>js代码:
window.onload=function(){
function $(id){
return document.getElementById(id);
}
function $$(ss){
return document.getElementsByClassName(ss);
}
function $$$(tag){
return document.getElementsByTagName(tag);
}
var buy=$$('sale_buy');
var saled=$$('goos_saled');
alert(dd.length);
var a=10;
for(var i=0;i<buy.length;i++){
buy[i].onclick=function(){
a=a+1;
buy[i].index=i;
$$('goos_saled')[this.index].style.width=(a+1)+'px';
}
}
}
还有一个问题,我想问问,如果想要实现秒杀进度条的进度是和后台数据库相对应的怎么实现啊,就是我点一下购买按钮,后台数据库商品就少一件,这个要怎么实现啊

解决方案 »

  1.   


    buy[i].onclick=function(){
            a=a+1;
            buy[i].index=i;
            $$('goos_saled')[this.index].style.width=(a+1)+'px';
            }
        }
    //这个地方function闭包了,所以a和i都是遍历最后一次的值,改成
    buy[i].onclick=(function(a,i){
    function(){
            a=a+1;
            buy[i].index=i;
            $$('goos_saled')[this.index].style.width=(a+1)+'px';
            }
       }    
    })(a,i)和数据库相对应,难道你现在的进度不是通过数据库取值算出来的吗?点一下后台删一个就好了,最好是添加一个IsDelete字段,点一下就改一下,因为这种业务有的有退货取消订单之类的
      

  2.   


     return function(){
            a=a+1;
            buy[i].index=i;
            $$('goos_saled')[this.index].style.width=(a+1)+'px';
            }
       }    
    })(a,i)
    //少了return
      

  3.   


     return function(){
            a=a+1;
            buy[i].index=i;
            $$('goos_saled')[this.index].style.width=(a+1)+'px';
            }
       }    
    })(a,i)
    //少了return
    原来是这样~谢谢大神
      

  4.   


     return function(){
            a=a+1;
            buy[i].index=i;
            $$('goos_saled')[this.index].style.width=(a+1)+'px';
            }
       }    
    })(a,i)
    //少了return
    我试了一下还是没有效果耶