Pergunta

Eu estou tentando atribuir o evento onclick para uma marca de âncora que já existe quando clico em outro elemento. No entanto, tudo o que eu tentei parece resultar no acionamento do evento imediatamente após atribuição. Estamos usando Prototype e Scriptaculous.

Esta é a função:

<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>

Como você pode dizer que eu tentei várias maneiras de atribuir o evento onclick para a tag âncora e nenhum deles funciona corretamente. No começo eu assumi que a função Effect.Appear na marca de âncora poderia ser disparando o evento onclick, então eu tentei mover a atribuição evento para após a função showStep mas isso não faz qualquer diferença. Além disso, eu tentei ligar para o stop () função imediatamente após a atribuição, mas isso não faz qualquer diferença quer.

Eu estou em meu juízo final com isso. Existe alguma maneira para mim para atribuir o evento onclick para a marca de âncora sem ter o fogo evento automaticamente? O que estou fazendo de errado?

Foi útil?

Solução

As funções são objeto de primeira classe em Javascript, isso significa que você pode atribuí-los a variáveis ??ou passá-las como argumentos para outras funções. Em seu código, você está confundindo chamadas de função com referências a funções.

Dê uma olhada este código:

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

O que isto faz passar o resultado da chamada para "loadData" para a função de observar. O que você quer fazer é passar uma referência para a chamada de função em vez disso. Você pode corrigi-lo facilmente, alterando o código para isso:

$(anchor_id).observe('click', function() { loadData(prv, dao_id, true) } );
Licenciado em: CC-BY-SA com atribuição
Não afiliado a StackOverflow
scroll top