為什么提示棧溢出，.call那里
<!DOCTYPE html>
<html lang="en">
<head>
? ?<meta charset="UTF-8">
? ?<title>Title</title>
? ?<style>
*{
? ? ? ? ? ?padding: 0;
margin: 0;
}
? ? ? ?li{
? ? ? ? ? ?list-style: none;
}
? ? ? ?.rating{
? ? ? ? ? ?width: 140px;
height: 26px;
margin:100px auto;
}
? ? ? ?.rating-item{
? ? ? ? ? ?float: left;
width: 26px;
height: 26px;
background: ?url(0.PNG)center center no-repeat;
background-size:cover;
cursor:pointer;
}
? ?</style>
</head>
<body>
<!--第一種實現(xiàn)方式-->
<ul class="rating" id="rating">
? ?<li class="rating-item" title="很不好"></li>
? ?<li class="rating-item" title="不好"></li>
? ?<li class="rating-item" title="一般"></li>
? ?<li class="rating-item" title="好"></li>
? ?<li class="rating-item" title="很好"></li>
</ul>
<!--<script src="jquery-1.3.2.min.js"></script>-->
<script src="https://cdn.bootcss.com/jquery/1.10.2/jquery.min.js"></script>
<script>
var rating=(function(){
? ? ? ? ? ?var extend=function(sunClass,superClass){
? ? ? ? ? ? ? ?var F=function(){}
? ? ? ? ? ? ? ?F.prototype=superClass.prototype;
sunClass.prototype=new F()
? ? ? ? ? ? ? ?sunClass.prototype.constructor=sunClass;
}
? ? ? ? ? ?var Light=function(el,mode,num){
? ? ? ? ? ? ? ?this.$el=$(el);
this.$item=this.$el.find('.rating-item');
this.mode=$(mode)
? ? ? ? ? ? ? ?this.num=num;
this.add=1;
}
? ? ? ? ? ?Light.prototype.init=function(){
? ? ? ? ? ? ? ?this.lightOn(this.num);
this.bindEvents();
this.select();
}
? ? ? ? ? ?Light.prototype.lightOn=function(num){
? ? ? ? ? ? ? ?num=parseInt(num);
this.$item.each(function(index){
? ? ? ? ? ? ? ? ? ?if(index<num){
? ? ? ? ? ? ? ? ? ? ? ?$(this).css('background-image','url(1.PNG)')
? ? ? ? ? ? ? ? ? ?}else{
? ? ? ? ? ? ? ? ? ? ? ?$(this).css('background-image','url(0.PNG)')
? ? ? ? ? ? ? ? ? ?}
? ? ? ? ? ? ? ?})
? ? ? ? ? ?}
? ? ? ? ? ?Light.prototype.bindEvents=function(){
? ? ? ? ? ? ? ?var _this=this;
_this.$el.on('mousemove','.rating-item',function(e){
? ? ? ? ? ? ? ? ? ?var $this=$(this)
? ? ? ? ? ? ? ? ? ?_this.select(e,$this)
? ? ? ? ? ? ? ? ? ?num=$this.index()+ _this.add
_this.lightOn(num)
? ? ? ? ? ? ? ?}).on('click','.rating-item',function(){
? ? ? ? ? ? ? ? ? ?_this.num=$(this).index()+_this.add
}).on('mouseout','.rating-item',function(){
? ? ? ? ? ? ? ? ? ?_this.lightOn(_this.num)
? ? ? ? ? ? ? ?})
? ? ? ? ? ?}
? ? ? ? ? ?Light.prototype.select=function(){
? ? ? ? ? ? ? throw new Error('子類必須重寫此方法')
? ? ? ? ? ?}
? ? ? ? ? ?//------------------整顆--------------------------------
var lightEnter=function(el,mode,num){
? ? ? ? ? ? ? ?Light.call(this,el,mode,num)
? ? ? ? ? ? ? ?}
? ? ? ? ? ?extend(lightEnter,Light)
? ? ? ? ? ?lightEnter.prototype.lightOn=function(num){
? ? ? ? ? ? ? ?Light.prototype.lightOn.call(this,num)
? ? ? ? ? ?}
? ? ? ? ? ?var _this=this;
lightEnter.prototype.select=function(){
? ? ? ? ? ? ? ?_this.add=1
}
? ? ? ? ? ?//-------------半顆---------------------------
var lightHalf=function(el,mode,num){
? ? ? ? ? ? ? ? ? ?lightHalf.call(this,el,mode,num)
? ? ? ? ? ? ? ?};
extend(lightHalf,Light)
? ? ? ? ? ?lightHalf.prototype.lightOn=function(num){
? ? ? ? ? ? ? ?var cont=parseInt(num);
var isFloat=cont!==num;
Light.prototype.lightOn(cont)
? ? ? ? ? ? ? ?if(isFloat){
? ? ? ? ? ? ? ? ? ?this.$item.eq(cont).css('background-image','url(2.PNG)')
? ? ? ? ? ? ? ?}
? ? ? ? ? ?};
lightHalf.prototype.select=function(e,$this){
? ? ? ? ? ? ? ?if(e.pageX-$this.offset().left<$this.width()/2){
? ? ? ? ? ? ? ? ? ?_this.add=0.5
}else{
? ? ? ? ? ? ? ? ? ?_this.add=1
}
? ? ? ? ? ?};
var mode1= {
? ? ? ? ? ? ? ?'lightEnter':lightEnter,
'lightHalf':lightHalf
}
? ? ? ? ? ?var init=function(el,mode,num){
? ? ? ? ? ? ? ?new mode1[mode](el,num).init();
}
? ? ? ? ? ?return {
? ? ? ? ? ? ? ?init:init
}
? ? ? ?})()
// ? ?rating.init('#rating','lightEnter',3)
rating.init('#rating','lightHalf',3)
</script>
</body>
</html>
