Acara pemasaan JavaScript

Acara Pemasaan 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.

Selepas mengklik butang dalam contoh ini, kotak amaran akan muncul selepas 5 saat:

<html>
<head>
<script type="text/javascript">
function timedMsg()
{
var t=setTimeout("alert('5 秒!')",5000)
}
</script>
</head>
<body>
<form>
<input type="button" value="显示定时的警告框" onClick = "timedMsg()">
</form>
<p>请点击上面的按钮。警告框会在 5 秒后显示。</p>
</body>
</html>

Atur cara dalam contoh ini akan melaksanakan pemasaan selama 2 saat, 4 saat dan 6 saat:

<html>
<head>
<script type="text/javascript">
function timedText()
{
var t1=setTimeout("document.getElementById('txt').value='2 秒'",2000)
var t2=setTimeout("document.getElementById('txt').value='4 秒'",4000)
var t3=setTimeout("document.getElementById('txt').value='6 秒'",6000)
}
</script>
</head>
<body>
<form>
<input type="button" value="显示计时的文本" onClick="timedText()">
<input type="text" id="txt">
</form>
<p>点击上面的按钮。输入框会显示出已经逝去的时间(2、4、6 秒)。</p>
</body>
</html>

Dalam contoh ini, selepas mengklik butang mula, program mula mengira dalam saat dari 0

<html>
<head>
<script type="text/javascript">
var c=0
var t
function timedCount()
{
document.getElementById('txt').value=c
c=c+1
t=setTimeout("timedCount()",1000)
}
</script>
</head>
<body>
<form>
<input type="button" value="开始计时!" onClick="timedCount()">
<input type="text" id="txt">
</form>
<p>请点击上面的按钮。输入框会从 0 开始一直进行计时。</p>
</body>
</html>

Dalam contoh ini, selepas mengklik butang kira, program mula mengira bawah berdasarkan nilai dimasukkan oleh pengguna. Klik butang berhenti untuk menghentikan pemasaan

<html>
<head>
<script type="text/javascript">
var c=0
var t
function timedCount()
{
document.getElementById('txt').value=c
c=c+1
t=setTimeout("timedCount()",1000)
}
function stopCount()
{
c=0;
setTimeout("document.getElementById('txt').value=0",0);
clearTimeout(t);
}
</script>
</head>
<body>
<form>
<input type="button" value="开始计时!" onClick="timedCount()">
<input type="text" id="txt">
<input type="button" value="停止计时!" onClick="stopCount()">
</form>
<p>请点击上面的“开始计时”按钮来启动计时器。输入框会一直进行计时,从 0 开始。点击“停止计时”按钮可以终止计时,并将计数重置为 0。</p>
</body>
</html>

Jam JavaScript kecil:

<html>
<head>
<script type="text/javascript">
function startTime()
{
var today=new Date()
var h=today.getHours()
var m=today.getMinutes()
var s=today.getSeconds()
// add a zero in front of numbers<10
m=checkTime(m)
s=checkTime(s)
document.getElementById('txt').innerHTML=h+":"+m+":"+s
t=setTimeout('startTime()',500)
}
function checkTime(i)
{
if (i<10) 
  {i="0" + i}
  return i
}
</script>
</head>
<body onload="startTime()">
<div id="txt"></div>
</body>
</html>

Acara pemasaan JavaScript

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

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

setTimeout() Laksanakan kod pada masa hadapan clearTimeout() Batalkan setTimeout()

setTimeout()

Syntax

var t=setTimeout("javascript statement", milisaat)

Kaedah setTimeout() akan mengembalikan nilai tertentu . 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. ) kaedah digunakan untuk menghentikan kod fungsi setInterval () yang dilaksanakan oleh kaedah

Syntax

window.clearInterval(intervalVariable)window. kaedah clearInterval() tidak boleh menggunakan awalan tetingkap , gunakan fungsi clearInterval() secara langsung.

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

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

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

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>时钟停止示例</title>
</head>
<body>
<p>页面上显示时钟:</p>
<p id="demo"></p>
<button onclick="myStopFunction()">停止时钟</button>
<script>
var myVar=setInterval(function(){myTimer()},1000);
function myTimer(){
var d=new Date();
var t=d.toLocaleTimeString();
document.getElementById("demo").innerHTML=t;
}
function myStopFunction(){
clearInterval(myVar);
}
</script>
</body>
</html>


Meneruskan pembelajaran
||
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> </head> <body> <p>点击第一个按钮等待3秒后出现"Hello"弹框。</p> <p>点击第二个按钮来阻止第一个函数运行。(你必须在3秒之前点击它)。</p> <button onclick="myFunction()">点我</button> <button onclick="myStopFunction()">停止弹框</button> <script> var myVar; function myFunction(){ myVar=setTimeout(function(){alert("Hello")},3000); } function myStopFunction(){ clearTimeout(myVar); } </script> </body> </html>
Tentang kita Penafian Sitemap
Laman web PHP Cina:Latihan PHP dalam talian kebajikan awam,Bantu pelajar PHP berkembang dengan cepat!