Variaveis "publicas" no Javascript e jQuery

Qualquer variavel referenciada com a clausula VAR ( Ex: var brazil = 'carnaval';) é criada e retirada da memoria, quando você efetua a chamada pra sua função, até ai compreensivel e recomendado, agora existe casos que vocë precisa manter valores em variaveis "publicas" para serem utilizados em varias partes do seu projeto, para isso, defina a variavel sem a clausula VAR (Ex: brazil = 'carnaval').

Agora se você definir dessa maneira as variaveis "publicas", dentro da função

$(document).read(function () { brazil='carnaval'});

Ela so vai existir dentro dessa função, então para fazer funcionar corretamente seus scripts, deixe essas variaveis "publicas" definidas, antes da chamada a essa função.

t+

Leitura dos objetos no jQuery

Acabei de descobrir depois de algum tempo de debugação, que o atributo ID utilizado nos campos de um formulario, se não forem referenciados, fazem com que o jQuery não funcione corretamente. No javascript o costume de codificar:

var elem = document.getElementById("nomedoobjeto");

Mesmo escrevendo o codigo assim :

input name="'objform1'"

É reconhecido tranquilamente, agora no jQuery, se você não colocar o ID:

input id='objform1' name='objform1'

Com certeza vai passar um bom tempo pra descobrir o porque que ele não trata o objeto corretamente.

Veja mais informações aqui

t+

Barra de Status no FIREFOX (window.status)

Pra muita gente que não sabe, aqui vai uma dica fundamental, pra quem quer que a mensagem sai na barra de ferramentas do FIREFOX, quando utilizamos a função:

windows.status("Mais por muito menos");

Pesquisando sobre o assunto, depois de muito tempo acabei achando a solução, simples e direta, Entre no FIREFOX vá em:

1. FERRAMENTAS
   
2. OPÇÕES
   
3. CONTEUDO
   
4. CLIQUE NO BOTÃO AVANÇADO DE PERMITIR JAVASCRIPT
   
5. SELECIONE MODIFICAR TEXTO NA BARRA DE STATUS.

E como dizem os meus amigos "E SEJA FELIZ".

t+

Dicas Javascript: Funções setTimeout, setInterval

Em um projeto de slideshow que tive que montar, o projeto rodou normalmente, até que o momento que fui testar no Firefox, ai descobri que a função setTimeout e setInterval, não funcionavam bem.

Primeiramente descobri que tinha que referenciar o objeto window , pois o meu codigo se encontrava assim:

Internet Explorer

• var vTimer = setTimeout("minhafuncao()",2000);

Funcionava tudo, mais descobri que no Firefox, tinha que ser:

• var vTimer = window.setTimeout("minhafuncao()",2000);

Tudo bem, era so referenciar o objeto window , mais anos e anos de programação direcionada para um unico Browser, não da pra ficar lembrando toda hora disso, até porque a função citada, não é uma que usamos toda hora.

Por isso utilize sempre a sintaxe do FIREFOX (como mostrado), para rodar nos dois, sem problemas .

t+

Parece simples, mais até acostumar!

Usar a jQuery no dia a dia da programação, realmente faz com que certos hábitos sejam mudados, parece uma nova linguagem no inicio, mais na verdade a abordagem (sintaxe) é diferente, mais com resultados muito melhores, programa-se uma vez só e pronto.

De cara substituir o document.getElementById por $(), já vale pelos bytes que economizamos, senão de computador os da memoria da gente, além do mais, depois que pega a manha fica fácil, veja por exemplo pra acessar e alterar uma propriedade CSS.

Javascript

var ele = document.getElementById("id_objeto");
ele.style.display = "none"; /* sumir com o objeto da tela */

/* Obs: Eu fiz assim porque no Firefox, você tem que referenciar o objeto antes e jogar pra uma variavel para tratar posteriormente, pelo menos não da erro no debugador, agora no jQuery, esquece isso, ele faz sozinho */

jQuery

$("#id_objeto").css("display","");


Observações

• Utilize sempre o # (cerquinha) para identificar o objeto referenciado pelo atributo ID utilizado nos objetos do seu script HTML.
• Não esqueça que para utilizar as funções jQuery, em qualquer parte do seu projeto, deve-se ser feita a primeira chamada, não importa em que parte do projeto, através da função $(document).ready(function{ seu script aqui dentro }); uma vez feito isso, em qualquer lugar que você referenciar o jQuery, vai funcionar.
  

Use a vontade...
t+

Ola Mundo - Primeiro contato

Dentro do HTMLKIT ou do seu editor de codigo fonte, crie um novo arquivo HTML (ele automaticamente cria as tags principais), temos que referenciar sempre a jQuery.js no arquivo HTML que estamos programando, para isso dentro da tag <head></head>, coloque:

<script type="text/javascript" src="jquery.js"></script>

Para executar qualquer comando após o carregamento do arquivo HTML, quer dizer, depois de ler tag </html>, carregar os arquivos de scripts e CSS, nos utlizamos do atributo onload dentro da tag <body>

<body onload='função' > </script>

Assim, após a identificação pelo browser do carregamento e estar pronto para ser exibido o HTML, ele verifica se onload existe e executa as funções ou função.

Encontrei na internet, a função JAVASCRIPT SETTIMEOUT ,que ficava verificando de tempo em tempo se determinado objeto já tinha sido carregado, em seguida processava a função desejada, adotei isso nos meus scripts, porque ia adiantando as configurações e ajustes necessarios para mostrar a pagina e só mostrava realmente quando tinha a certeza que os principais objetos estavam carregados.

Na jQuery, a coisa funciona parecida com o SETTIMEOUT, ele já vai processando as funções desejadas que vocë programou, antes mesmo do total carregamento da pagina. Leia artigo aqui

Utilize para isso, o comando:

$(document).ready( function{});

Sintaxe:


• $() : utilizado em todas as funções que devem ser referenciadas a jQuery
• document : expressão que indica o documento HTML
  
• ready() : associado a leitura do documento enquanto está sendo carregado
• function{} : dentro das chaves {}, colocar os comandos javascript ou jQuery que serão interpretados pelo browser (isso mesmo o browser é um interpretador de comandos)
  




Na verdade, até que não é difícil entender, a instrução $() referencia as funções jQuery, as expressões, marcadores, id, etc. dentro da $(), no exemplo document, vai ser analisada e interpretada pela jQuery, que em seguida atribui uma propriedade/função jQuery (ready) para executar uma determinada função criada pelo usuário.


Vamos a um exemplo completo:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>APRENDENDO jQuery</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script type="text/javascript" src="jquery.js"></script>
<script language="JavaScript" type="text/javascript">
$(document).ready(function() {
alert("Ola Mundo");
}
)
//-->
</script>
</head>
<body>
</body>
</html>


Copie o codigo acima e cole dentro do HTMLKIT, salve o arquivo na pasta onde esta a jQuery.js e execute para ver o resultado.

A mensagem OLA MUNDO, será mostrada.

t+

Ambiente de Programação

Primeiramente vamos fazer o download da jQuery, clicando nesse link http://code.jquery.com/jquery-latest.pack.js, recomendo salvar ela com jquery.js, numa pasta para você inicialmente começar os seus estudos.

Vou utilizar o HTML KIT, ele é muito bom, porque permite que você vá programando e testando o que está sendo feito, além de diversos recursos, que você poderá conferir no proprio site, se você estiver acostumado com outro não tem problema, utilize o que mais lhe convir.

O HTML KIT, pelo que entendi, utiliza a plataforma do Internet Explorer, por isso, não custa nada deixar o FIREFOX aberto com o script e testar também nele o que se está fazendo, já que o grande apelo da jQuery, e essa compatibilidade de Browsers que ele propicia na sua utilização.

Dentro do site JQUERY BRASIL, (que me motivou a fazer esse Blog) , o pessoal lá traduziu a documentação, é uma das coisas que não podemos deixar de lado, para o aprendizado e aperfeiçoamento.


Após preparar seu ambiente de trabalho, vamos partir para o proximo POST - OLÁ MUNDO.

Porque a jQuery?

Ola, a intensão de criar esse blog, foi para compartilhar minha experiência desde o principio com a API JQUERY, da qual pretendo me tornar um otimo utilizador.

Como todos já sabem, quando temos que partir para uma nova empreitada, parece que os exemplos que buscamos, são um tanto obscuros, já que as pessoas, que possuem experiências, esquecem a lacuna que temos entre o entender e o fazer, vou tentar sempre mostrar passo a passo com exemplos em javascript e como ficaria no JQUERY, Deus queira que eu tenha tempo, porque paralelamente estarei convertendo o projeto que estou desenvolvendo de um framework, que me consumiu os ultimos 4 anos e não consigo acabar, visto a variedade e a dinamica das linguagens que são atualizadas e inovadas todos os dias.

A jQuery se mostra uma mão na roda, no sentido de padronização e compatibilidade com os browsers existentes, isso com certeza já motiva o aprendizado, sem falar que a documentação já está sendo bem divulgada e muita gente esta aderindo.

Ajuda nunca é demais, aguardo ansioso o final do projeto para estar mais apto a ser um programador JQUERY.

Abraços a todos.