La compréhension Backbone.js gestionnaire d'événements
Voici donc mon point de vue:
$(function() {
var ImageManipulation = Backbone.View.extend({
el: $('body'),
tagName: "img",
events: {
'mouseover img': 'fullsize',
'click img#current': 'shrink'
},
initialize: function() {
_.bindAll(this, 'render', 'fullsize', 'shrink');
//var message = this.fullsize;
//message.bind("test", this.fullsize);
},
render: function() {
},
fullsize: function() {
console.log("in fullsize function");
console.log(this.el);
$('.drop-shadow').click(function() {
console.log(this.id);
if (this.id != 'current') {
$('.individual').fadeIn();
$(this).css('position', 'absolute');
$(this).css('z-index', '999');
$(this).animate({
top: '10px',
height: '432px',
}, 500, function() {
this.id = "current";
console.log("animation complete");
return true;
});
};
});
},
shrink: function() {
$('.individual').fadeOut();
$('#current').animate({
height: '150px',
}, 500, function() {
this.id = "";
$(this).css('position', 'relative');
$(this).css('z-index', '1');
console.log("animation complete");
return true;
});
}
});
var startImages = new ImageManipulation();
});
Ce que je ne comprends pas, c'est comment changer la el de faire "de cette" prendre sur le cliquez sur la fonction que j'ai en full-size. Je préférerais de beaucoup avoir le déclic fonction jQuery retirés et ont la fonction mouseover être un autre clic, mais je ne peux pas sembler pour savoir comment assigner 'ce' pour l'image particulière qui est cliqué. J'espère que ma question a du sens.
Je pense que vous pourriez avoir à utiliser serialise
http://documentcloud.github.com/backbone/#View-extend
également la el: 'body'
pas $('body')
c'est sur l'un des exemples il est donc probablement s'attend à être une chaîne de caractères plutôt que d'un objet
OriginalL'auteur thatmiddleway | 2011-07-27
Vous devez vous connecter pour publier un commentaire.
Épine dorsale du gestionnaire d'événement suppose que vous voulez savoir sur l'objet (à la fois son code, et de ses DOM représentation, la
View.el
objet) pour chaque événement, et que l'événement vise à modifier certains aspects de la vue et/ou d'un modèle. La cible réelle de la cliquez est quelque chose que vous êtes supposé savoir, ou supposé être capable de dériver.Dérivation est plutôt simple:
Et remplacer tous vos
this.
références au sein de votre appel àtarget.
.this.
continuera à se référer à laView
instance. Dans votre fonction intérieure, de l'anonyme attribuée à.drop-shadow
,this.
fera référence à l'objet qui vient d'être cliqué. Si vous voulez accéder au contexte environnant, utilisez la fermeture, le transfert de l'idiome:Une alternative est d'utiliser le
_.bind()
méthode (fourni par l'épine dorsale de la dépendance, underscore.js) pour lier la fonction interne àthis
(le point de Vue de l'objet) et l'utilisation de laev.currentTarget
, au lieu de laself/this
truc.OriginalL'auteur Elf Sternberg