Bug nella creazione di elementi di jQuery?

Question

$ (document) .ready (function() {var _new_li = $ ('', { 'id': 'p', 'testo': 'ClickMe', clic: function() {alert ('licenziato'); },
dati: { 'somedata': 'somedata', }
});

_new_li.appendTo($("#example")); 
}); 

ricevo un "TypeError Uncaught: Impossibile leggere la proprietà 'click 'di indefinito ", quando provo a fare clic sull'eleme nt che ho creato così. Ma, se si cambia click: e dati: funziona.

$(document).ready(function(){ 
    var _new_li  = $('<li/>',  { 
     'id':  'p', 
     'text': 'CLICKME', 
     data:  { 
      'somedata': 'somedata', 
     }, 
     click: function(){ 
      alert('fired'); 
     }      
    }); 

_new_li.appendTo($("#example")); 
}); 

qualsiasi spiegazione per tale comportamento?

Cordiali saluti

--Andy

PS:

Ho pubblicato un comportamento simile in precedenza nel forum jQuery Nucleo di sviluppo, il signor Swedberg rispose lì:

I'm pretty sure this is happening because you're setting data with an object, which >(until 1.4.2) would overwrite the event object. Not sure which version of jQuery you're >using in your project, but it looked like the jsbin example was using 1.4. Try upgrading >to 1.4.2 and see if that helps.

Ma sembra che il problema esista ancora in 1.4.2

Answer 1

Post riscritto.

Non si deve mettere questa virgola dopo l'ultimo (e solo) elemento nei dati.

Dopo aver provato alcune cose ho avuto modo di questo:

$(document).ready(function(){ 
    var fun=function(){ 
      alert('fired'); 
     }; 
    var parms={ 
     'id':  'p', 
     'text': 'CLICKME',  
     'click':fun,   
     'data':  { 
      'somedata': 'somedata' 
     } 
     }; 
     console.log(parms); 
    var _new_li = $('<li/>',parms); 

_new_li.appendTo($("#example")); 
}); 

Tutto funziona bene fino a quando clicco sul elemento li. Quindi ricevo e is undefined (jquery line 55). Funziona bene quando il clic e i dati vengono scambiati.

ancora indagando

e l'ho trovato

versione di sviluppo jquery, linea 1919

var events = jQuery.data(this, "events"), handlers = events[ event.type ];

eventi non è definito.

jquery sovrascrive gli eventi memorizzati nei dati.

quindi questo è un bug. Dovrebbe solo estendersi.

Ho inviato una segnalazione di errore.

Answer 2

Ho finito per modificare leggermente il codice sorgente, quindi non sarebbe saltato qui in modo casuale.

handle: function(event) { 
... 

// tbn modified source 
try { 
    var events = jQuery.data(this, "events"), handlers = events[ event.type ]; 
} catch(e) {} 
// tbn modified source 

..poi ri-minified la fonte

Non ho avuto alcun problema con questo dal (ancora).

Answer 3

Non so se questo aiuta, ma mi trovavo in un problema simile. Stavo cercando di associare eventi come mouseout, clic, ecc. A un nuovo elemento LI. Ho ricevuto l'errore 'Uncaught TypeError: Impossibile leggere la proprietà' mouseout 'di undefined'. Risulta, è necessario associare eventi come clic, mouseout, ecc ... dopo aver aggiunto l'elemento al DOM. Non prima. Esempio di massima:

newLI = $('<li />'); 
$(document.body).append(newLI); // Correct 
newLI.click(...); 
newLI.mouseout(...); 

invece di

newLI = $('<li />'); 
newLI.click(...); 
newLI.mouseout(...); 
$(document.body).append(newLI); // Incorrect 

Answer 4

gente .. questo non è un bug .. quello che sta succedendo è che è necessario utilizzare l'argomento dati degli eventi

.click([ eventData ], handler(eventObject)) 

eventDataA mappa di dati che verranno passati al gestore di eventi.

per sapere perché è necessario riesaminare la discussione nella documentazione jquery di .bind() .. si potrebbe anche voler rivedere il concetto di "chiusura" in javascript .. fornisce la logica alla base di tutto questo

questa parte è particolarmente rilevante (tratto da http://api.jquery.com/bind/):

passaggio di dati evento

Il parametro EVENTDATA opzionale non è comunemente usato. Se fornito, questo argomento ci consente di passare ulteriori informazioni al gestore. Un utile utilizzo di questo parametro consiste nel risolvere i problemi causati dalle chiusure. Ad esempio, supponiamo di avere due gestori di eventi che entrambi si riferiscono alla stessa variabile esterna:

var message = 'Spoon!'; 
$('#foo').bind('click', function() { 
    alert(message); 
}); 
message = 'Not in the face!'; 
$('#bar').bind('click', function() { 
    alert(message); 
}); 

Perché i gestori sono chiusure che entrambi hanno un messaggio nel loro ambiente, sia visualizzerà il messaggio Non in faccia! quando attivato. Il valore della variabile è cambiato. Per aggirare questo, possiamo passare il messaggio in utilizzando EVENTDATA:

var message = 'Spoon!'; 
$('#foo').bind('click', {msg: message}, function(event) { 
    alert(event.data.msg); 
}); 
message = 'Not in the face!'; 
$('#bar').bind('click', {msg: message}, function(event) { 
    alert(event.data.msg); 
}); 

Questa volta la variabile non è indicato direttamente all'interno dei gestori; invece, la variabile viene passata in base al valore attraverso eventData, che corregge il valore nel momento in cui l'evento è associato. Il primo handler ora mostrerà Spoon! mentre il secondo avviserà Not in the face!