Usuário com melhor resposta
Problema ao referenciar arquivo Jquery em .js.

Pergunta
-
Olaa,
Implementei algumas funcionalidades em Jquery , quando coloco as mesmas no <head> do meu Form ele funciona perfeitamente, não apresenta nenhum problema . Só que queria retirá-lo do <head> do meu Form e colocado na pasta onde fica os outros scripts Jquery .Segui os seguintes passos.
1) Criei um arquivo teste.js que contem toda a implementação que estava no <head> do meu Form, esse arquivo está contido na pasta testescript junto com outros arquivos Jquery .O arquivo teste.js pode ser visualizado abaixo:
$(document).ready(function () { ... Implementação das funcionalidades.
...
}2) Logo após com o arquivo teste.js devidamente criado na pasta testescript . Fiz a referencia do mesmo no <head> do meu Form , conforme mostrado abaixo:
<script src="testescript /teste.js " type="text/javascript"></script>
Só que não funciona, nada do que foi feito e que antes funcionava perfeitamente funciona . Como resolver tal problema ?
Desde Já, Agradeço.
Respostas
-
Bom, não sei se é a melhor maneira, mas você pode criar variáveis globais e então setá-las no processamento da página aspx.
Por exemplo, criar um arquivo globals.js:
// Variáveis globais var idCliente; var idTeste;<br/>
E então na página aspx, colocar a tag script setando as variáveis globais:
Creio que deva ajudar<script language="javascript" type="text/javascript" src="globals.js"></script> <script language="javascript" type="text/javascript"> idCliente = <% %>; </script> <script language="javascript" type="text/javascript" src="teste.js"></script>
- Marcado como Resposta _dev quarta-feira, 16 de março de 2011 03:20
Todas as Respostas
-
-
-
-
Prezado Luiz Estevam,
Obrigado pela atenção, todos os meus outros arquivos Jquery tambêm estão na pasta testescript , faço referencia a todos esses arquivos no <head> do meu Form , conforme mostrado abaixo:
<head>
<script src="testescript/jquery-1.4.1.min.js " type="text/javascript"></script>
<script src="testescript/jquery-1.4.1.js " type="text/javascript"></script>
<script src="testescript/jquery-1.4.1-vsdoc.js " type="text/javascript"></script>
<script src="testescript/jquery.alphanumeric.js " type="text/javascript"></script>
<script src="testescript/jquery.maskedinput-1.2.2.js " type ="text / javascript"></script>
//Script com minhas implementações :
<script src="testescript/teste.js " type="text/javascript"></script>
</head>
Mas se eu estou referenciando os mesmos conforme mostrado acima, porque não estaria sendo encontrada a biblioteca Jquery ??
Novamente Obrigado.
-
Seu arquivo teste.js esta só com as function JS ou você colocou a tag inicial e final do JS (<script></script>), pois o arquvio teste.js não deve conter estas TAGS.
Abraço
Estevam
**** Se a reposta foi útil, então não esqueça de marca-lá. *** -
-
-
Prezado Luiz Estevam,
As implementações contidas no arquivo Jquery , se referem a mascaras , verificação se o que é digitado é numérico e estão associadas a textboxes , não há nada associado a botões. Nenhum erro é mostrado, a página é dada como concluida, nada referente a erros aparece.Coloquei um break point no arquivo Jquery e o mesmo é chamado normalmente quando entra na página, algo que não acontece posteriormente.
Novamente Obrigado.
-
Rodrigo, realmente se no momento que se chama as funções, seja através de botão ou eventos, e não é demonstrado erro algum ai fica complicado, infelizmente no momento não tenho mais idéias para lhe ajudar.
Abraço
Estevam
**** Se a reposta foi útil, então não esqueça de marca-lá. *** -
-
Rodrigo, acompanhando esta thread, acho que seu problema é semântica. Veja:
Quando você inclui scripts direto na tag HEAD, estes serão executados assim que página ser carregada e o parser do JS passar por alí.
Quando você inclui seu script em arquivo separado, você deve invocá-lo assinando eventos da página. No seu caso, usando o JQuery, dentro do arquivo .js assine o evento onload da página. Exemplo:
$(window).load(function(){ // implementação das funcionalidades. });
Faça o teste.
Abraços.
.Net Architect, MCTS .Net Framework 2.0, Web Applications -
-
-
Prezado Maicon Guerra,
Segue abaixo a implementação das funcionalidades que estão contidas no arquivo teste.js :
$(document).ready(function () { $("#<%= txtIdCliente.ClientID %>").numeric(); $("#<%= txtIdCliente.ClientID %>").focusout(function () { var idCliente = $("#<%= txtIdCliente.ClientID %>").val(); if (idCliente != '') { $("#<%= txtIdCliente.ClientID %>").val(AddZeroEsquerda(idCliente, 2)) } else { $("#<%= txtIdCliente.ClientID %>").val('') } retornaNomeCliente(); AtivaDesativaBotao() }); function AtivaDesativaBotao() { var idCliente = $("#<%= txtIdCliente.ClientID %>").val(); if (idCliente != '') { var dados = "{ iDCliente: \ " + idCliente + "\ }"; RequisicaoAjax("consultaDadosCliente.aspx/obterStatusCliente", dados, function (ret) { var controle = ret.d; if (controle == "0") { $('#consultar :enabled').attr('disabled', true); } else if (controle == "1") { $('#consultar :enabled').attr('disabled', false); } }); } else { $('#consultar :enabled').attr('disabled', true); } } function retornaNomeCliente() { var idCliente = $("#<%= txtIdCliente.ClientID %>").val(); if (idCliente != '') { var dados = "{ iDCliente: \ " + idCliente + "\ }"; RequisicaoAjax("consultaDadosCliente.aspx/RetornaNomeCliente", dados, function (ret) { var nomeCliente = ret.d; $("#<%= txtNomeCliente.ClientID %>").val(nomePif); }); } else { $("#<%= lblErro.ClientID %>").text(''); } } }); function AddZeroEsquerda(elemento, Tamanho) { var elem = elemento.toString(); while (elem.length < Tamanho) { elem = '0' + elem; } return elem; }; function RequisicaoAjax(url, dados, ret) { $.ajax({ type: "POST", url: url, data: dados, contentType: "application/json; charset=utf-8", dataType: "json", success: ret, error: function (Excecao, Status, erroThrown) { var error = JSON.parse(Excecao.responseText); $("#<%= lblErro.ClientID %>").text(error.Message); } }); }
Novamente Obrigado.
-
Rodrigo, não tem muito segredo. Olha só:
Assinar o evento load da página:
<body onload="load()">
No seu arquivo .js (devidamente referenciado no head da pagína), faça:
function load(){
$(document).ready(function () { $("#<%= txtIdCliente.ClientID %>").numeric(); $("#<%= txtIdCliente.ClientID %>").focusout(function () { var idCliente = $("#<%= txtIdCliente.ClientID %>").val(); if (idCliente != '') { $("#<%= txtIdCliente.ClientID %>").val(AddZeroEsquerda(idCliente, 2)) } else { $("#<%= txtIdCliente.ClientID %>").val('') } retornaNomeCliente(); AtivaDesativaBotao()
}
Simples assim!
.Net Architect, MCTS .Net Framework 2.0, Web Applications -
Prezado Maicon Guerra,
Novamente muito obrigado por sua atenção, fiz exatamente como você me indicou e não funcionou, segue abaixo o código para uma melhor visualização.
1) <head>.
<head runat="server">
<title></title>
<script src="testescript/jquery-1.4.1.min.js" type="text/javascript"></script>
<script src="testescript/jquery-1.4.1.js" type="text/javascript"></script>
<script src="testescript/jquery-1.4.1-vsdoc.js" type="text/javascript"></script>
<script src="testescript/jquery.alphanumeric.js" type="text/javascript"></script>
<script src="testescript/jquery.maskedinput-1.2.2.js" type="text/javascript"></script>
<script src="testescript/teste.js " type="text/javascript"></script>
</head>
2) <body>.
<body onload="load() ">
...
</body>3) Arquivo teste.js na pasta testescript .
function load() {
$(document).ready(function () {
...implementação das funcionalidades já mostrada por mim anteriormente.
}
}Novamente muito obrigado.
-
Bom, eu recomendaria o uso do Firefox com a extensão Firebug (http://getfirebug.com/) para você depurar o erro que está encontrando. Provavelmente são duas explicações: Ou o seu jQuery está referenciado incorretamente, ou há algum código incorreto no seu arquivo teste.js.
Também te aconselho a usar da forma em que estava no começo dessa thread, utilizando o jQuery para disparar o evento do load(), e não colocar no código html. Evite sempre colocar o que é de funcionalidade no código html, deixe essa tarefa para o javascript.
Mais uma coisa: coloque nas suas tags <script> o atributo language="javascript", por boas práticas.
Resumindo, eu faria os seguintes passos para verificar o que pode ser:
1) Abriria a página com o Firefox, com o Firebug ativado.
2) Bem provavelmente o erro aparecerá explicado, assim você pode correr atrás do que é. Pode ser, por exemplo, um erro de sintaxe - como a falta de um ); no fim do $(document).ready(function() { }.
Espero ter ajudado. Mantenha-nos informados caso o erro seja resolvido! :) -
Prezado Guilherme Rey,
Muito obrigado por sua atenção, realizei todos os testes aconselhados por vc, mas não é apresentado nenhum erro pelo Firebug, o que me chama mais atenção é o fato do codigo Jquery quando colocado no <head> da página funcionar perfeitamente, sem erros.Mas quando copiado exatamente para um aquivo ocorre esse problema.
Novamente Muito obrigado por sua atenção.
Grande abraço.
-
O arquivo teste.js contém as tags <% %> ? Se sim, eu creio que não devam funcionar.
Teste no arquivo teste.js algo bem simples, por exemplo:
$(document).ready(function() {
alert("Carregou");
});
Se isso funcionar, quer dizer que o código inserido nele que não executa da maneira correta.
Se realmente for esse o problema, para poder pegar coisas do servidor, você pode tentar colocar variáveis globais e as setar com tags <% %> no <head> da sua página aspx.
-
-
Maravilha! Então isso significa que o arquivo é carregado corretamente!
Ele só aparece quando a página é carregada porque você mandou ele fazer isso :)
Então provavelmente o problema é o uso das tags <% %> no seu javascript, que não devem ser processadas no servidor. Agora é só detectar o erro do código, e não mais da referência. :)
-
Prezado Guilherme,
Novamente obrigado pela atenção, mas o que é aconselhado para substituir as tags <%%> ???, segue abaixo um pequeno trecho do código para melhor visualização:
$(document).ready(function () { ... $("#<%= txtIdCliente.ClientID %>").numeric(); ... }
Novamente obrigado.
-
Bom, não sei se é a melhor maneira, mas você pode criar variáveis globais e então setá-las no processamento da página aspx.
Por exemplo, criar um arquivo globals.js:
// Variáveis globais var idCliente; var idTeste;<br/>
E então na página aspx, colocar a tag script setando as variáveis globais:
Creio que deva ajudar<script language="javascript" type="text/javascript" src="globals.js"></script> <script language="javascript" type="text/javascript"> idCliente = <% %>; </script> <script language="javascript" type="text/javascript" src="teste.js"></script>
- Marcado como Resposta _dev quarta-feira, 16 de março de 2011 03:20
-
-