Perplesso dal comportamento DOM caricato in modo dinamico Selezione = indefinito

Question

Di seguito è riportato il seguente codice che funziona perfettamente per il caricamento dinamico di un discesa selezionata. Il codice viene chiamato nella funzione pronta per i documenti per caricare i dati in una pagina. Il codice funziona bene. Tuttavia, sono rimasto perplesso per il fatto che sembra "indefinito" nel DOM. cioè evento .Change ecc ... quando provo a selezionare un valore ....

Nell'HTML, è impostato semplicemente:

<select id="optionsChaa" name="chaa_id" class="largewidth"></select>

Il codice jQuery è il seguente. Funziona. Sentiti libero di usarlo nei tuoi codici

var optionsValues = '<select id="optionsChaa" name="chaa_id" class="largewidth">';
                optionsValues += '<option value=""></option>';
                $.each(result, function() {
                    optionsValues += '<option value="' + this.chaa_id.val + '">' + this.chaa_name + '</option>';
                });
                optionsValues += '</select>';

                var options = $('#optionsChaa');
                options.replaceWith(optionsValues);

                $('#optionsChaa').change(function() {

                   // Alert returns undefined...

                    alert($(this).val() );

                });

Allora perché è "indefinito" dopo il DOM?

Answer 1

Penso che ci sia qualcosa che non va con il this.chaa_id.val parte. In each, "questo" si riferisce all'elemento "corrente" (cioè un membro del results Vettore).

Answer 2

Potresti mostrare cosa c'è nel tuo result variabile?

Ho provato l'impostazione del tuo codice result come:

var result = [
    { 'chaa_id' : { 'val' : 1 }, 'chaa_name' : 'name1'},
    { 'chaa_id' : { 'val' : 2 }, 'chaa_name' : 'name2'}
]

E il alert() sembra funzionare.