Come interrompere l'evento Click dall'esecuzione nella funzione Javascript?

Question

Sto cercando di assegnare l'evento onclick a un tag di ancoraggio che esiste già quando faccio clic su un altro elemento. Tuttavia, tutto ciò che ho provato sembra provocare l'attivazione dell'evento immediatamente dopo l'assegnazione. Stiamo usando Prototype e Scriptaculous.

Questa è la funzione:

<script type="text/javascript">     
    function loadData(step, dao_id) {
        var div_id = 'div_' + step;
        var anchor_id = 'step_anchor_' + step;
        var prv = step -1;

        switch(step) {
            case 1:
                var action = 'major_list';
                break;
            case 2:
                var action = 'alumni_list';
                break;
            case 3:
                var action = 'alumnus_display';
                break;
        }

        new Ajax.Request('awizard.php', {
                method: 'get',
                parameters: {action : action, dao_id : dao_id},
                onSuccess: function(data) {
                    $(div_id).innerHTML = data.responseText;
                    //$(anchor_id).observe('click', loadData(prv, dao_id, true));
                    //Event.observe(anchor_id, 'click', alert('I executed'));

                    showStep(step);

                    //$(anchor_id).onclick = loadData(prv, dao_id, true);
                    //$(anchor_id).observe('click', loadData(prv, dao_id, true));

                }
            }
        )                   
    }

    function showStep(step, toggleBack) {

        var div_id = 'div_' + step;
        if(!toggleBack) {
            if(step != 1) {
                var prv = step -1;
                Effect.SlideUp('div_' + prv, { duration:1, delay:0 });
            }

            Effect.SlideDown(div_id, { duration:1, delay:1 });
            Effect.Appear('step_anchor_' + step, { duration:1, delay:2 });
        } else {

            var prv = step -1;
            Effect.SlideDown('div_' + prv, { duration:1, delay:0 });
            Effect.SlideUp(div_id, { duration:1, delay:1 });
            Effect.Fade('step_anchor_' + step, { duration:1, delay:2 });
        }               
    }
</script>

Come puoi vedere, ho provato diversi modi per assegnare l'evento onclick al tag anchor e nessuno di essi funziona correttamente. Inizialmente supponevo che la funzione Effect.Appear sul tag anchor potesse attivare l'evento onclick, quindi ho provato a spostare l'assegnazione dell'evento dopo la funzione showStep, ma ciò non ha fatto alcuna differenza. Inoltre, ho provato a chiamare la funzione stop () immediatamente dopo l'assegnazione, ma non ha fatto alcuna differenza.

Sono al mio ingegno e finisco con questo. Esiste un modo per assegnare l'evento onclick al tag di ancoraggio senza che l'evento venga attivato automaticamente? Cosa sto sbagliando?

Answer 1

Le funzioni sono oggetti di prima classe in Javascript, questo significa che puoi assegnarle a variabili o passarle come argomenti ad altre funzioni. Nel tuo codice, stai confondendo le chiamate di funzione con riferimenti a funzioni.

Dai un'occhiata a questo codice:

$(anchor_id).observe('click', loadData(prv, dao_id, true));

A cosa serve il risultato della chiamata a " loadData " alla funzione di osservazione. Quello che vuoi fare è invece passare un riferimento alla chiamata di funzione. Puoi risolverlo facilmente modificando il codice in questo:

$(anchor_id).observe('click', function() { loadData(prv, dao_id, true) } );