Acara pemasaan JavaScript

Peristiwa Masa JavaScript

Dengan menggunakan JavaScript, kami mempunyai keupayaan untuk melaksanakan kod selepas selang masa yang ditetapkan, bukannya sejurus selepas fungsi dipanggil. Kami memanggil ini acara masa.

Amat mudah untuk menggunakan peristiwa pemasaan dalam JavaScript Dua kaedah utama ialah:

setInterval() - Jalankan kod yang ditentukan secara berterusan untuk bilangan milisaat yang ditentukan.

setTimeout() - Laksanakan kod yang ditentukan selepas menjeda untuk bilangan milisaat yang ditentukan

Nota: setInterval() dan setTimeout() ialah dua kaedah bagi objek HTML DOM Window.

kaedah setInterval()

setInterval() melaksanakan kod yang ditentukan secara berterusan untuk bilangan milisaat yang ditetapkan

Sintaks

window.setInterval("fungsi javascript ",milisaat);

kaedah window.setInterval() boleh menggunakan fungsi setInterval() secara langsung tanpa menggunakan awalan tetingkap.

setInterval() Parameter pertama ialah fungsi.

Bilangan milisaat antara parameter kedua

Nota: 1000 milisaat ialah satu saat.

"hello" muncul setiap tiga saat:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>
<button onclick="myFunction()">点我</button>
<script>
function myFunction(){
setInterval(function(){alert("Hello")},3000);
}
</script>
</body>
</html>

Bagaimana untuk menghentikan pelaksanaan?

Kaedah clearInterval() digunakan untuk menghentikan kod fungsi setInterval() pelaksanaan kaedah.

Syntax

window.clearInterval(intervalVariable)

kaedah window.clearInterval() boleh menggunakan fungsi clearInterval() secara langsung tanpa menggunakan awalan tetingkap.

Untuk menggunakan kaedah clearInterval(), anda mesti menggunakan pembolehubah global semasa mencipta kaedah pemasaan:

myVar=setInterval("javascript function",milisaat);

Kemudian anda boleh menggunakan kaedah clearInterval() untuk menghentikan pelaksanaan.

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
<script>
var t = self.setInterval("clock()",50)
function clock()
{
var time=new Date()
document.getElementById("clock_show").innerHTML=time
}
</script>
</head>
<body>
  <p id="clock_show"></p>
  <button onclick="window.clearInterval(t)">停止计时</button>
</body>
</html>

kaedah setTimeout()

Syntax

window.setTimeout("fungsi javascript", milisaat);

kaedah setTimeout() akan mengembalikan kaedah tertentu nilai. Dalam pernyataan di atas, nilai disimpan dalam pembolehubah bernama t. Jika anda ingin membatalkan setTimeout(), anda boleh menentukannya menggunakan nama pembolehubah ini.

Parameter pertama setTimeout() ialah rentetan yang mengandungi pernyataan JavaScript. Ini mungkin pernyataan seperti "alert('5 seconds!')", atau panggilan ke fungsi seperti alertMsg()".

Parameter kedua menunjukkan berapa milisaat dari masa semasa yang pertama parameter akan dilaksanakan.

Petua: 1000 milisaat bersamaan dengan satu saat

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>
<button onclick="myFunction()">点我</button>
<script>
function myFunction(){
setTimeout(function(){alert("Hello")},3000);
}
</script>
</body>
</html>

Bagaimana untuk menghentikan pelaksanaan?

Kaedah clearTimeout() digunakan untuk menghentikan pelaksanaan. kod fungsi kaedah setTimeout()

Syntax

window.clearTimeout(timeoutVariable)

Kaedah window.clearTimeout() boleh digunakan tanpa awalan tetingkap

Untuk menggunakan kaedah clearTimeout(), anda mesti menggunakan pembolehubah global dalam mencipta kaedah tamat masa (setTimeout):

myVar=setTimeout("javascript function",milisaat);

Jika fungsi belum dilaksanakan lagi, anda boleh menggunakan kaedah clearTimeout() Berhenti melaksanakan kod fungsi

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
<script>
    var s = 0;
    var n = 0;
    var t;
    function timeCount()
    {
    document.getElementById('second_show').value = s;
    n = n+1;
    s = n/10;
    t = setTimeout("timeCount()",100);
    }
</script>
</head>
<body>
  <form>
    <input type="button" value="开始计时" onClick="timeCount()">
    <input type="text" id="second_show">
    <input type="button" value="结束计时" onClick="clearTimeout(t)">
  </form>
</body>
</html>

Meneruskan pembelajaran

fail baharu

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文网(php.cn)</title> <script> var s = 0; var n = 0; var t; function timeCount() { document.getElementById('second_show').value = s; n = n+1; s = n/10; t = setTimeout("timeCount()",100); } </script> </head> <body> <form> <input type="button" value="开始计时" onClick="timeCount()"> <input type="text" id="second_show"> <input type="button" value="结束计时" onClick="clearTimeout(t)"> </form> </body> </html>

serahkan Tetapkan Semula Kod

Operasi automatik

Acara pemasaan JavaScript

peringkat rendahTutorial tapak web tiruan perusahaan Imperial CMS

peringkat rendahPemula dengan asas sifar dalam WordPress membina blog peribadi dan laman web korporat

peringkat rendahVideo arahan pembinaan tapak web berasaskan sifar CMS muktamad

peringkat rendahProjek hadapan-Shangyou [amalan komprehensif teknologi HTML/CSS/JS]

PertengahanVue3.0 daripada 0 untuk membina amalan projek sistem pengurusan belakang universal

peringkat rendahKursus front-end berasaskan sifar [pembelajaran lanjutan Vue dan aplikasi praktikal]

peringkat rendahTutorial bahagian hadapan WEB [HTML5+CSS3+JS]

peringkat rendahBermula dengan cepat dengan apipost

PertengahanTutorial praktikal Vue3+TypeScript amalan projek peringkat perusahaan

peringkat rendahMari kita bercakap secara ringkas tentang memulakan perniagaan dalam PHP

PertengahanProjek e-dagang VUE (pertempuran sebenar projek dua bahagian hadapan & belakang)

peringkat rendahAplikasi praktikal Apipost [api, antara muka, ujian automatik, olok-olok]