jQuery: value.attr non è una funzione

Question

ho questo snipped nella mia pagina:

$('#category_sorting_form_save').click(function(){ 
    var elements = $("#category_sorting_elements > div"); 
    $.each(elements, function(key, value) { 
     console.info(key," : ",value); 
     console.info("cat_id: ",value.attr('cat_id')); 
    }); 
}); 

E quando viene eseguito, ottengo:

0 : <div class="dragable" cat_id="6" value="" style="opacity: 1;">  
value.attr is not a function 
    console.info("cat_id: ",value.attr('cat_id')); 

che cosa sto facendo male qui? Sto cercando di ottenere il valore dell'elemento div.cat_id.

Answer 1

I contenuti di quell'oggetto jQuery sono semplici elementi DOM, che non rispondono ai metodi jQuery (ad esempio .attr). È necessario avvolgere il valore con $() per trasformarlo in un oggetto jQuery per utilizzarlo.

console.info("cat_id: ", $(value).attr('cat_id')); 

o semplicemente utilizzare il metodo DOM direttamente

console.info("cat_id: ", value.getAttribute('cat_id')); 

Answer 2

Avete a che fare con l'elemento DOM cruda .. bisogno di avvolgerlo in un oggetto jQuery

console.info("cat_id: ",$(value).attr('cat_id')); 

Answer 3

Il secondo parametro di la funzione di callback passata a each() conterrà l'elemento DOM effettivo e non un oggetto wrapper jQuery. È possibile chiamare il metodo getAttribute() dell'elemento:

$('#category_sorting_form_save').click(function() { 
    var elements = $("#category_sorting_elements > div"); 
    $.each(elements, function(key, value) { 
     console.info(key, ": ", value); 
     console.info("cat_id: ", value.getAttribute('cat_id')); 
    }); 
}); 

o avvolgere l'elemento in un jQuery oggetto da soli:

$('#category_sorting_form_save').click(function() { 
    var elements = $("#category_sorting_elements > div"); 
    $.each(elements, function(key, value) { 
     console.info(key, ": ", value); 
     console.info("cat_id: ", $(value).attr('cat_id')); 
    }); 
}); 

O semplicemente utilizzare $(this):

$('#category_sorting_form_save').click(function() { 
    var elements = $("#category_sorting_elements > div"); 
    $.each(elements, function() { 
     console.info("cat_id: ", $(this).attr('cat_id')); 
    }); 
});