O conceito de timer e atraso
//- Timer
// número de identificação do temporizador setInterval (função de retorno de chamada, milissegundos);
// Ligue para a função de retorno de chamada a cada milissegundos
// ClearInterval (número de identificação do temporizador)
// Pare o cronômetro com o número de identificação especificado (realmente destruindo e liberando recursos)
//-Atraso
// Número de ID de atraso setTimeout (função de retorno de chamada, intervalo de milissegundos)
// Comece a partir da chamada, aguarde o número especificado de milissegundos e ligue para a função de retorno de chamada uma vez, termine
// Use ClearTimeout para limpar o atraso
Imagem de reprodução:
A figura a seguir aparecerá após a abertura da página: depois disso, o número do valor do botão diminui em 1 a cada 1 segundo até 0 parar o conteúdo do botão ficar agradável
Código de implementação:
A cópia do código é a seguinte:
<! Doctype html public "-// w3c // dtd xhtml 1.0 transitional // pt" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-bransitional.dtd">
<html xmlns = "http://www.w3.org/1999/xhtml">
<head>
<Title> </title>
<style type = "text/css">
#btn
{
Largura: 200px;
Altura: 50px;
Antecedentes -Color: Gary;
}
</style>
<script type = "text/javascript">
OnLoad = function () {
// Obtenha o objeto de botão
var btn = document.getElementById ('BTN');
// Crie um cronômetro e retorne o ID do temporizador
var intervalid = setInterval (function () {
var waitSecond = parseint ((// d+/). Exec (btn.value)); // use o método regexp.exec () para retornar o conteúdo da string correspondente
WaitSecond-; // Time-
if (waitsecond> = 0) {// julgamento
btn.value = btn.value.replace (// d+/, waitsecond) // use o método String.Repleace (regexp, código) para substituir o número no valor do botão e retornar o resultado da substituição
} outro {
btn.value = 'concordo'; // altere o valor do botão para concordar
btn.disabled = false; // altere o valor desativado do botão para false
ClearInterval (intervalido); // Limpe o temporizador
}
}, 1000);
};
</script>
</head>
<Body>
<input type = "button" name = "name" value = "Leia cuidadosamente por 5 segundos e clique para concordar em continuar" id = "btn" desativado = "desativado"/>
</body>
</html>