从原型功能

这个代码显示了两只猫和次点击每只猫数里面的函数，我怎么能增加每只猫的.clicks酒店需要从Cat.prototype.clickInc内递增this.clicks（）方法？从原型功能

$(document).ready(function() { 
    var cats = []; 

    var Cat = function(id, image_path) { 

    this.id = id; 
    this.image_path = image_path; 
    this.clicks = 0; 

}; 


Cat.prototype.clickInc = function() { 

    $('#'+this.id).click(function(){ 

    this.clicks++; 

     return this.clicks; 
    }); 
    };//use a closure here 

var poly = new Cat("poly", "poly.jpg"); 
var chewie = new Cat("chewie", "chewie.jpg"); 
cats.push(poly); 
cats.push(chewie); 

for(i=0; i<cats.length; i++) 
{  
    var catInfo = '<div class="cats"><div id="'+cats[i].id+'"><img src='+cats[i].image_path+'><h3>'+cats[i].id+'</h3></div><div class="clickNos"><span ="label">Number of clicks</span><span class="clicks">'+cats[i].clicks+'</span></div></div>'; 
    $("#container").append(catInfo); 
    cats[i].clickInc(); 
} 


});

来源

2017-04-19 Reme

代码不规则凹陷使得这里这个问题很*** ***难以阅读。只是一个提示：如果您以易于阅读的格式显示问题并使用正确缩进的代码，您将更快地获得帮助（并且任何在将来使用代码的人也会感谢您！） – apsillers

@FelixKling'javascript'在问题中有更多的问题，只有在事件处理程序中访问正确的'this'，包括试图从'click'处理程序中'返回'而不是设置'.innerHTML'适当的元素，这在链接问题/答案 – guest271314

@ guest271314我同意并重新打开。就像Felix一样，我不明白OP希望更新'>'元素，但现在你指出了这一点，这似乎是对问题的正确解释。 – apsillers

this不Cat.click()处理程序中。另外，您不能从事件处理程序return。使用.next(".clickNos")与.find(".clicks")来选择下一个.clicks元素相对于被点击的<img>元素;设置.html()的匹配元素为.clicksCat实例的属性。

Cat.prototype.clickInc = function() { 
    var _cat = this; 
    $('#' + this.id).click(function() { 
     _cat.clicks++; 
     $(this).next(".clickNos").find(".clicks").html(" " +_cat.clicks); 
    }); 
    };

的jsfiddle https://jsfiddle.net/9cykvbyv/1/

来源

2017-04-19 18:32:40 guest271314

完美的作品，谢谢！ – Reme

回答

相关问题