问题描述(小提琴):
我正在尝试清空/取消设置this.rotated
的值,并从最初定义它们的事件之外的事件中this.locked
。我需要这些"锁定"变量对于每只小猫都是唯一的,以防止它们发生后续.mousedown()
事件。
最终目标是能够连续点击三只较小的猫,让第四只大猫淡入,点击第四只猫,然后重置一切。
我对this
的掌握充其量是松散的;在大多数情况下足以使用它,但严重缺乏对其范围和有用性的透彻理解。老实说,我甚至不确定我的标题是否准确,但我想不出另一种表达方式。
法典:
var count = 0;
$('.cats').each(function(i){
$(this).mousedown(function() {
$(this).css({
'transform': 'rotate(45deg)',
'-webkit-transform': 'rotate(45deg)'
});
this.rotated = 1, this.locked;
if (this.rotated && !this.locked) {
this.locked = 1;
count++;
if (count > 2) {
$('#newCat').fadeIn();
}
}
});
});
$('#newCat').mousedown(function() {
$(this).fadeOut();
$('.cats').fadeOut(function() {
$(this).css({
'transform': 'rotate(0deg)',
'-webkit-transform': 'rotate(0deg)'
})
.fadeIn();
});
});
你似乎几乎已经拥有了它。当你这样做$('.cats').fadeOut()
你回到了猫的范围,this.locked
和this.rotated
可以再次访问,尽管你还需要在它们被锁定时再次减少计数。
工作小提琴:http://jsfiddle.net/SB57D/4/
此外,锁定和旋转具有相同的目的,您可以摆脱其中之一。