4

Estou com dúvida no js para chamar uma função em outro js.

Exemplo:

if (nome == ""){
   exibirModal();
}

Como a função "exibirModal()" está em outro js, está dando erro como se a função não tivesse sido declarada.

No meu html coloquei o script exibirMensagem.js e depois o meu cadastro.js

3
  • possível duplicata de Como chamar funções Javascript em outro Javascript
    – Caputo
    Commented 23/07/2014 às 19:38
  • 2
    Se nenhuma das soluções funcionou, e se sua pergunta é diferente da indicada pelo @Caputo, é necessário que você apresente maiores informações, possivelmente o código-fonte. Commented 23/07/2014 às 20:47
  • @user13545 adicione o código fonte dos dois arquivos
    – melkysalem
    Commented 24/07/2014 às 0:23

5 Respostas 5

5

Pelo que você está dizendo, se os arquivos estão sendo carregados na ordem correta – ou seja, o que contém a declaração da função exibirModal sendo carregado antes do que tenta chamar essa função –, tudo indica que você tem um problema de escopo.

Provavelmente a função exibirModal está sendo declarada dentro de outra função. Se ela não depender de variáveis declaradas nessa outra função, movê-la para fora (ou seja, para o escopo global) deve resolver. Senão, altere a declaração de algo como:

function exibirModal() { ...

para:

window.exibirModal = function() { ...
2
  • 1
    cara vlw mesmo! funcionou!
    – user13545
    Commented 24/07/2014 às 12:29
  • Show, só adicionei em outro arquivo como se estivesse no mesmo e funcionou aqui. Vlw Commented 14/06/2019 às 19:26
2

Você poderá fazer com que o primeiro script execute uma função existente no segundo script, mas para isso deverá engatilhar a execução ao evento onloaddo documento como este exemplo (usando jQuery):

$(document).ready(function() {
   somar(a,b); //somar() ainda será definido
});
7
  • 1
    Não é necessário e não deve ser este o problema. O carregamento de scripts em uma página é síncrono. A página não continua a se carregar enquanto o arquivo incluído não foi carregado. Veja esta questão para mais detalhes. Commented 23/07/2014 às 20:17
  • @Beterraba acho que você não entendeu a resposta. Ele quer exibir um modal mas o método não foi carregado, então ele realizará a chamada apenas no document ready, onde tudo já foi carregado
    – gpupo
    Commented 23/07/2014 às 20:21
  • Exatamente. Não tem como a função não ter sido carregada, já que o autor da pergunta explicita que ele incluiu o arquivo onde a função está declarada antes do arquivo de onde a função é chamada. Commented 23/07/2014 às 20:38
  • @Beterraba para mim não está explícita a ordem em que ele está carregando
    – gpupo
    Commented 23/07/2014 às 20:45
  • Tá escrito na pergunta: "No meu html coloquei o script exibirMensagem.js e depois o meu cadastro.js". Mas beleza, só comentei pra esclarecer o ponto. Commented 24/07/2014 às 13:14
2

Você deve esperar que toda a página seja carregada para ter acesso aos elementos DOM, o que provavelmente acontece dentro da sua função exibirModal(). Sendo assim, experimente aproveitar para fazer a chamada em uma função disparada pelo evento "onload":

window.addEventListener("load", function(){
    if (nome == ""){ exibirModal(); }
});
3
  • Não é necessário e não deve ser este o problema. O carregamento de scripts em uma página é síncrono. A página não continua a se carregar enquanto o arquivo incluído não foi carregado. Veja esta questão para mais detalhes. Commented 23/07/2014 às 20:17
  • 1
    Conforme apontado pelo @Beterraba, de fato, os scripts são carregados de maneira síncrona, na sequência em que foram chamados, fato aparentemente já sabido pelo OP. Assim, editei minha resposta para esclarecer melhor. Commented 23/07/2014 às 20:45
  • vlw pelo retorno!
    – user13545
    Commented 24/07/2014 às 12:22
2

Já conhece o RequireJS ? http://requirejs.org/

O RequireJS é um carregador de arquivos JavaScript e de módulos. É uma biblioteca javascript.

Baixe em http://requirejs.org/docs/download.html#requirejs ou referencie em seu html no CDN //cdnjs.cloudflare.com/ajax/libs/require.js/2.1.14/require.min.js

Com o RequireJS você informa que certo trecho do seu código javascript requer, ou seja, precisa que outra biblioteca javascript esteja carregada.

Exemplo (adaptando de http://requirejs.org/docs/start.html) :

Digamos que seu site tem essa estrutura :

project-directory/
--project.html
--scripts/
----cadastro.js
----exibirMensagem.js
----require.min.js  (faça o download em http://requirejs.org/docs/release/2.1.14/minified/require.js )

Então em seu HTML faça algo do tipo :

<!DOCTYPE html>
<html>
    <head>
        <title>My Sample Project</title>
        <!-- O atributo data-main diz para o require.js carregar
             scripts/cadastro.js depois que o require.js seja carregado. -->
        <script data-main="scripts/cadastro" src="scripts/require.js"></script>
    </head>
    <body>
        <h1>My Sample Project</h1>
    </body>
</html>

Finalmente dentro de seu cadastro.js você faz algo do tipo :

    require(["exibirMensagem"], function(exibirMensagem) {

     if (nome == ""){ exibirModal(); }

    //Essa função será executada quando exibirMensagem.js for carregado.
    //Se exibirMensagem.js usar o método define() (mais detalhes em http://requirejs.org/docs/api.html#define ), então essa função só será disparada quando todos os módulos definidos forem carregados.
});

Espero que ajude.

2
  • cara estava com o mesmo problema, e achei bacana o que você disse a respeito do RequireJS, nunca havia ouvido falar, e vai me ajudar muito. Valeu, e parabens Commented 24/07/2014 às 12:19
  • Vou tentar agora... fiz outros teste e não deu certo... vlw!!!
    – user13545
    Commented 24/07/2014 às 12:23
0

Verifica que a ordem da incorporação dos seu script exibirMensagem.js e cadastro.js. Abra o console do navegador (geralmente F12) e tente executar a função desejada.

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .