Utilisation correcte de jQuery .data()

Question

S'IL VOUS PLAÎT NOTE J'ai mis à jour CETTE QUESTION DE NOUVELLES DONNÉES ET LIENS

Je possède ce code basé sur this documentation

le code fonctionne ici: http://jsfiddle.net/mplungjan/7ZBxP/

mais pas ici:

Je reçois Error: $(this).data("orgSize") is undefined

en ligne width: $(this).data("orgSize").width,

$(".ui-tooltip img.thumb") 
.live("mouseenter",function() { 
    cont_left = $(".ui-tooltip").position().left; // no container until hover 
    // save this scaled down image size for later 
    $(this).data("newSize",{width:this.width,height:this.height}) 
    $(this).parent().parent().css("z-index", 1);  
    $(this).animate({ 
     width: $(this).data("orgSize").width, 
     height: $(this).data("orgSize").height, 
     left: "-=50", 
     top: "-=50" 
    }, "fast"); 
    }) 

ici est où je définir:

var imageObject = $('<img/>').load(function(){ 
     var w = this.width; 
     var h = this.height; 
     var orgSize = {width:w,height:h}; 
     var imgId = "thumb_"+p_sPubNum; 
     var actualImage = $('<img/>') 
     .attr("id",imgId) 
     .attr("src",sOpsUrl + sImageUrl) 
     .attr("alt",loadingLabel+': '+p_sPubNum) 
     .addClass("thumb");    
     // set EITHER width OR height if either is > 150 
     if (w<h && w>150) actualImage.attr("width",150); 
     else if (w>h && h > 150) actualImage.attr("height",150); 

     $('.qTip2Image').append(actualImage); 
     // save original size for later  
     $("#"+imgId).data("orgSize",orgSize); 

    }).error(function() { 
     if ((iPos + 1) < aPublicationNumbers.length) { 
     var sNextNumber = aPublicationNumbers[(iPos + 1)]; 
     getImage(sNextNumber, sDirection); 
     } 
    }).attr("src",sOpsUrl + sImageUrl); 

Answer 1

$('.qTip2Image').append(actualImage); 
    // save original size for later  
$("#"+imgId).data("orgSize",orgSize); // <<<<<<<<<< too early 

---

var actualImage = $('<img/>') 
.attr("id",imgId) 
.attr("src",sOpsUrl + sImageUrl) 
.attr("alt",loadingLabel+': '+p_sPubNum) 
.addClass("thumb") 
.data("orgSize",orgSize); // <<<<<<<<<< This is much better!!! 

Raison, il a travaillé dans le violon était le plus petit DOM

Answer 2

Il vous donne non défini parce que vous accédez à la largeur proerty Wich est indéfini puisque vous venez de créer le elemnt!

comme vous pouvez le voir ce violon le code est correct

http://jsfiddle.net/ZL4DG/

Answer 3

Vous ne définissez pas la src de l'image comment voulez-vous, il déclenchera l'événement load. Attachez une erreur event gestionnaire dans un tel cas. De même, vous n'avez défini aucune largeur et hauteur pour l'élément créé, de sorte qu'il n'aura pas de dimensions par défaut lorsqu'il n'y a pas de source définie. Où est imgId défini dans votre code? Où définissez-vous id à l'élément nouvellement créé? Dans ce cas, comment va-t-il trouver $("#"+imgId)?