Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Vinicius Rangel

[Resolvido] Criar Plugin Jquery

Por , em Javascript

Recommended Posts

Vinicius Rangel    208

Vinicius Rangel
Postado

Fala galera beleza? recentemente decidir me aventurar criando plugin Jquery, tenho um conhecimento médio na linguagem e estou com grandes dificuldades, primeiro de tudo nem os exemplos funcionam que vejo.

 

vamos lá eu fiz algo básico e estruturei da seguinte maneira

 

(function($){
$.fn.myTestePlugin= function(){
         $(this).html('TNC');
}
})(jQuery);

e eu estou utilizando a versão do Jquery 1.7

 

e chamo da seguinte maneira

<script type="text/javascript">
$('#teste').myTestePlugin();
</script>

 

e minha div com ID TESTE existe.

 

nem erro acontece, simplesmente ele não faz nada.

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado

você fez essa chamada antes ou depois do html da div ?

 

abra o console de erros: Ctrl+Shift+J:

 

http://wbruno.com.br/2011/03/31/como-debugar-javascript-firefox-erros-comuns/

Compartilhar este post

Link para o post
Compartilhar em outros sites

Vinicius Rangel    208

Vinicius Rangel
Postado
você fez essa chamada antes ou depois do html da div ?

 

antes.

<html lang="pt-BR">
<head>
<meta charset="UTF-8">
<title>eeee</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
<script type="text/javascript" src="PluginTeste.js"></script>
<script type="text/javascript">
$('#teste').myTestePlugin();
</script>
<style type="text/css">
	#teste {width:200px; height:200px; display:block;}
</style>
</head>
<body>
<div id="teste">

</div>
</body>
</html>

Eu uso google Chorme e trabalho com o Inpesct Element e ele não me da nenhum erro esse é o problema pois se desse eu resolveria.

 

Por coincidência, acabei de ler um artigo sobre isso, quem sabe te ajude:

Cara infelizmente foi um tutorial de estudo porém não tive sucesso.

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado

você precisa esperar o DOM carregar, para só depois usar elementos:

 

<script type="text/javascript">
$(document).ready(function(){
       $('#teste').myTestePlugin();
});
</script>

por favor, verifique no console de erros do Firefox, eu pessoalmente prefiro.

Compartilhar este post

Link para o post
Compartilhar em outros sites

Vinicius Rangel    208

Vinicius Rangel
Postado

você precisa esperar o DOM carregar, para só depois usar elementos:

 

<script type="text/javascript">
$(document).ready(function(){
       $('#teste').myTestePlugin();
});
</script>

por favor, verifique no console de erros do Firefox, eu pessoalmente prefiro.

 

muito bom, funcionou.

 

agora vem uma dúvida:

 

eu vi em alguns tutoriais esperar carregar o DOM antes de chamar o plugin

 

assim:

 

function($){
$.fn.myTestePlugin = function(){
        $(document).ready(function(){
         		return this.each(function(){
		$(this).html('TNC');
	})
}

        });
})(jQuery);

 

não funcionou, por que eu não posso fazer desse jeito.

 

afinal queria deixar o mais limpo possível mesmo o ready fora do plugin ser pouca coisa seria melhor.

 

obrigado

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado

não funcionou, por que eu não posso fazer desse jeito.

pq uma coisa é uma coisa, e outra coisa é outra coisa.

 

Isso que você fez ai, é uma clousure, para encapsular o apelido $.

Não tem nada a ver com o ready.

Compartilhar este post

Link para o post
Compartilhar em outros sites

Vinicius Rangel    208

Vinicius Rangel
Postado

pq uma coisa é uma coisa, e outra coisa é outra coisa.

 

Isso que você fez ai, é uma clousure, para encapsular o apelido $.

Não tem nada a ver com o ready.

esta tudo fluindo numa boa dei uma pesquisada e realmente cheguei a essa conclusão..

vlw

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Javascript
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito