Página
Inicial

Power

Artigos

BD
SQL

JavaScript

Vídeo Aulas

Xiko.php

Algoritmos

Alunos

SQL OnLine

Sugestões
e Críticas

Horário do
Professor

Cadastro

Lembrar Senha

JavaScript em Exemplos - Página 2


Exemplo 6 :

Este script abre e fecha uma janela quando o usuário clica em botões.. ( veja funcionando ).

< script>
function abrejanela() {
// cria a função abrejanela
    temp=window.open("", "tempwindow", "toolbar=0,location=0,directories=0,status=0,menubar=0,scrollbars=0,resizable=0,width=550,height=120");
    temp.document.writeln("Você clicou no botão para abrir a janela");
// com window.open abre uma janela com vários parâmetros.
    document.uberaba.botao1.disabled = true ;
// desabilita o botão botao1
    document.uberaba.botao2.disabled = false ;
// habilita o botão botao2
}
function fechajanela() {
// cria a função fechajanela
    temp.window.close();
// fecha a janela aberta com window.open na função abrejanela
    document.uberaba.botao1.disabled = false ;
// habilita o botão botao1
    document.uberaba.botao2.disabled = true ;
// disabilita o botão botao2
}
function inicio() {
// cria a função inicio()
    document.uberaba.botao1.disabled = false ;
// habilita o botão botao1
    document.uberaba.botao2.disabled = true ;
// disabilita o botão botao2
}
< /script>
< body onLoad="inicio()">
// Quando a página for carregada pelo browser, a função inicio() será executada
< br>< br>< br>< br>// muda de linha, cada é como se fosse um enter.
< form name="uberaba">
// cria um formulário html com nome uberaba
    < input type="button" name="botao1" value="Mostra" onClick="abrejanela()">
// cria o botão botao1, quando o usuário clicar neste botão a função abrejanela() será executada.
    < input type="button" name="botao2" value="Fecha" onClick="fechajanela()">
// cria o botão botao2 quando o usuário clicar neste botão a função fechajanela() será executada.
< /form>
// finaliza o formulário uberaba
< /body>


Voltar


Exemplo 7 :

Este script calcula o fatorial de um número informado pelo usuário. ( veja funcionando ).

< script>
function calcula() {
// cria a função calcula, elaborada para calcular o fatorial
    var a = 0;
// cria a a variavel a
    var b = 1;
// cria a a variavel b
    var c = 1;
// cria a a variavel c
    if ( isNaN(document.araxa.v1.value) ) {
// verifica se o número digitado realmente é um número
        alert("Você não digitou un número !") ;
// se a informação digitada não é numérico avisa o usuário.
        document.araxa.v1.value = 0;
// coloca zero no campo v1, porque o usuário digitou errado.
    } else {
// se a informação digitada em v1 é numérica
        a = parseInt( document.araxa.v1.value ) ;
// a variável a recebe o conteúdo de v1, convertido para integer.
        while ( b <= a ) {
// enquanto a variável b for menor ou igual a variavel a, faça
            c = c * b ;
// a variável c recebe o resultado da multiplicação de c * b
            b++ ; 
// a variável b será incrementada em 1, também poderia ser escrito b = b + 1 ;
        }
// final do laço while
        document.araxa.r1.value = c ;
// o campo r1 do formulário recebe o fatorial do número digitado em v1
     }
// fecha o if
}
// fecha o function
function inicio() {
// cria a função inicio()
    document.araxa.r1.disabled = true ; 
// disabilita o acesso ao campo r1, porque será utilizado apenas para mostrar o resultado.
    document.araxa.v1.focus() ;
// coloca o cursor no campo v1, para o usuário digitar o número
} // fecha o function
< /script>
< body onLoad="inicio()">
// quando a página for carregada pelo browser, será executado a função inicio().
< form name="araxa">
// cria um formulário html com nome araxa
    Digite um número : < input type="text" name="v1" value="">
// cria o campo v1
    < input type="button" name="b1" value="Processa" onClick="calcula()">
// cria o botão fecha o function
    o fatorial do número digitado é : < input type="text" name="r1">
// campo r1 para mostrar o resultado.
// finaliza o formulário araxa.


Voltar


Exemplo 8 :

Este script mostra uma sequência de números de 0 até 30. O usuário informa qual será o valor do incremente. Por exemplo: se o usuário digitar 5, o script mostrará 0, 5, 10, 15, 20, 25, 30. ( veja funcionando ).

< script>
function calcula() {
// Cria a função calcula.
    var a = b = 0;
// Cria as variáveis a e b, com valor inicial zero.
    var c = '';
// Cria a variavel c.
    if ( isNaN(document.form1.v1.value) ) {
// Se o usuário digitar caracteres não númerio no campo v1.
        alert("Você não digitou un número !");
// avisa que v1 deve ser numérico.
        document.form1.v1.value = 0;
// Coloca ZERO em v1.
    } else {
// Senão, o usuário digitou apenas caracteres numérios
        if ( parseInt(document.form1.v1.value) > 10 ) {
// Se o número digitado pelo usuário for maior que 10
            alert("Você digitou un número maior que 10 !");
// avisa o usuário que o número não pode ser maior que 10
            document.form1.v1.value = 0;
// coloca zero no campo v1
        } else {
// Senão, significa que o usuário digitou um número menor ou igual a 10
            if ( parseInt(document.form1.v1.value) < 1 ) {
// Se o número digitado pelo usuário for menor que 1
alert("Você digitou um número menor que 1 !");
// Avisa o usuário que o número não pode ser menor que 1
document.form1.v1.value = 0;
// coloca zero no campo v1
            } else {
// Senão, significa que o usuário digitou um número entre 1 e 10.
b = parseInt( document.form1.v1.value );
// Converte a informação digitada pelo usuário para integer e coloca na variável b
for ( a = 0 ; a <= 30 ; a+=b ) {
// a recebe zero; enquanto a menor ou igual a 30; a = a + b
c = c + a + ',  ';
// na variável c concatena-se o resultado a ser mostrado, a cada laço do for.
}
document.form1.r1.value = c ;
// O campo r1 recebe o conteúdo da variável c.  
            }
        }
    }
}
function inicio() {
// Cria a função inicio().
    document.form1.r1.disabled = true ;
// Não permite que o usuário altere o campo r1.
    document.form1.v1.focus() ;
// coloca o cursor no campo v1.
}
< /script>
< body onLoad="inicio()">
// Quando o browser carregar está página, será executado a função inicio().
Mostra de 0 até 30. O usuário informa qual será o valor de incremento :

< form name="form1">
// Cria o fomulário form1
Digite um número de 1 a 10 em seguida digite enter ou tab :
< input type="text" name="v1" value="" onchange="calcula()">

// Cria o campo v1, quando este campo for alterado pelo usuário (onchange), será executado a função calcula().
Resultado : < input type="text" name="r1" size="90">
// Cria o campo r1, com tamanho 90
< /form>


Voltar


Exemplo 9 :

Este script mostra que pode-se ter acesso aos campos de um formulário html, sem fazer referencia ao nome do campo. Isto é possivel utilizando-se ELEMENTS. ( veja funcionando ).

< script>
function mostra() {
// Cria a função mostra()
    var a = b = 0;
// Cria as variáveis a e b com valor inical zero.
    var c = '';
// Cria a variavel c.
    a = parseInt(document.form1.elements.length) ;
// elements.length retorna o número de objetos (campos) existem em um formulário. Neste exemplo document.form1.elements.length é igual a 5 (v1,v2,v3,v4 e v5). Assim a variável a receberá o valor 5.
    while ( b < a ) {
// Enquanto b for menor que a
        c = c + b + "=" + document.form1.elements[b].value + " ;
" ;
// elements[0].value é igual a v1.value , elements[1].value é igual a v2.value e assim sucessivamente. Portanto na variável c estamos concatenando o resultado que desejamos mostrar.
        b++ ;
// este comando equivale a : b = b + 1 ;
    }
    document.writeln ( c );
// mostra o conteúdo da variável c.
}
< /script>
< form name="form1">
// Cria o formulário form1
< input type="text" name="v1">
// Cria o campo (objeto) v1
< input type="text" name="v2">
// Cria o campo (objeto) v2
< input type="text" name="v3">
// Cria o campo (objeto) v3
< input type="text" name="v4">
// Cria o campo (objeto) v4
< input type="text" name="v5" value="" onchange="mostra()">
// Cria o campo (objeto) v5, quando v5 é alterado (onchange) é executado a função mostra().
< /form>


Voltar


Exemplo 10 :

Este script mostra que utilizando o método indexOf pode-se descubrir se existe uma letra em uma palavra ou frase. ( veja funcionando ).

< script>
function verifica() {
// Cria a função verifica(), responsável por verificar a existência da letra na palavra
    var a = new String ;
// Cria variável a , do tipo string.
    var b = new String ;
// Cria variável b , do tipo string.
    a = document.f1.p.value ;
// Coloca na variável a a palavra digitada no campo p.
    b = document.f1.l.value ;
// Coloca na variável b a letra digitada no campo l.
    if ( a.indexOf(b) == -1 ) {
// Se o indxOf da letra, que agora está na variável b, for igual a -1, significa que não existe a letra dentro da palavra que agora está na variável a.
        alert("Não foi encontrado a letra " + b + " na palavra " + a );
// Avisa o usuário que não tem a letra
    } else {
// Senão, o indexOf retornou o número onde foi encontrado a letra.
        alert("Foi encontrado a letra [ " + b + " ] na palavra " + a + ", está na posição " + (a.indexOf(b)+1) );
// Avisa o usuário que existe a letra, e a posição onde ela foi encontrada
    }
}
< /script>
< form name="f1">
Digite uma palavra : < input type="text" name="palavra" size="15">

Digite uma letra : < input type="text" name="letra" size="2" maxlength="1" onchange="verifica()">

< /form>

// Veja outro exemplo de como o indexOf funciona : ( veja funcionando )
var x = 0;
x = "uberaba".indexOf("r") ;
// A variável x receberá a posição da letra r na palavra uberaba. Ou seja 3, porque o primeiro index é zero, então u=0. b=1, e=2, r=3, a=4, ....
alert( "a letra r está na posição " + x );
// Mostra o valor de x quando procuramos a letra r na palavra uberaba
x = "uberaba".indexOf("v") ;
// procura a letra v na palavra uberaba. A variável x receberá -1 porque indexOf não encontrou a letra v em uberaba.
alert( "a letra v não está na palavra uberaba, indexof= [ " + x + " ]");
// Mostra o valor de x


Voltar