Jquery e aggiunta di una riga alla tabella

Question

Ho il seguente codice jquery.

var destTable = $("#numbers"); 
$(document).ready(function() { 
    $("#btnAdd").click(function() { 
    //Take the text, and also the ddl value and insert as table row. 
    var newRow = $("<tr><td>hi</td></tr>"); 
    $("#numbers").append(newRow); 
    }); 
}); 

Quello che vorrei davvero è memorizzare un riferimento a un elemento una volta e quindi utilizzarlo da lì su di esso.

Il codice sopra aggiunto è una riga sul mio tavolo come previsto, ma se lo uso. $(destTable).append(newRow) o destTable.append(newRow) non succede niente che qualcuno possa far luce su questo per me?

Grazie

Answer 1

mantenere il riferimento all'interno document.ready:

$(document).ready(function() { 
    var destTable = $("#numbers"); 
    $("#btnAdd").click(function() { 
    //Take the text, and also the ddl value and insert as table row. 
    var newRow = $("<tr><td>hi</td></tr>"); 
    $("#numbers").append(newRow); 
    }); 
}); 

Il punto di document.ready è quello di attendere che il DOM per essere pronti; se provi a fare $('#numbers'); al di fuori di esso (e il codice non appare dopo l'elemento nel documento) il DOM non avrà ancora creato questo elemento in modo da non avere un riferimento appropriato ad esso.

Una volta fatto questo, si dovrebbe essere in grado di fare:

destTable.append(newRow); 

All'interno della funzione click. Come ultima nota, tuttavia, è prassi comune e accettata preordinare le variabili che rappresentano i set jQuery con uno $. Quindi questa è la cosa migliore:

var $destTable = $("#numbers"); 

Answer 2

tuo grado di utilizzare appendTo come questo:

$("<tr><td>Hello</tr><tr>").appendTo("#MyTable > tbody")