Tìm hiểu về Time-out
Timeouts là một bản thời gian đếm ngược. Nó cho phép bạn thực thi một lệnh
lập đi lập lại nhiều lần nhưng không chồng chất chúng lên nhau.
Timeout là một phần công việc quan trong và quen thuộc trong việc tạo ra một
hay nhiều hiệu ứng đẹp trên trang Web
Giờ mình sẽ đi vào phần chính luôn.
Nếu bạn muốn có 1 khách xem trang web của bạn trong 30s thì trang web sẽ
tự động trả về một thông báo, bạn hãy làm giống như dưới này…
<script type="text/javascript">
<!--
setTimeout("alert('Thời gian 30 giây đã hết.');",30000);
// -->
</script>
Trình duyệt sẽ trả về kết quả như thế này sau 30s bạn vào trang Web…
Tiếp theo nhé:
Đây là cấu trúc chính của Timeout:
setTimeout ( "function or expression", delaytime );
cái delaytime sẽ có một giá trị là 1000 đơn vị thì = 1 giây. Như vậy bạn có thể
đặt cho nó thời gian xuất hiện sớm hơn hay trẽ hơn tùy thuộc vào cái này.
Function or expression nghĩa là ở vị trí này ta có thể đặt một hàm số hay là một
biểu thức đều được,
Bây giờ ta hãy thử xét một ví dụ nữa … (Cái này là tự mình cho ví dụ nên có
thể hơi dở )
Dưới này là một ví dụ về việc gọi một function timingex() bằng cách nhấn cái
button “Click me!” .
Sau đó trình duyệt sẽ đếm 3 giây và trả về một bản thông báo “Ba giây đã qua
gùi!”…
<script type="text/javascript">
<!--
function timingex( ){
setTimeout("alert(' Ba giây đã qua gùi!”.');",3000);
}
// -->
</script>
<form>
<input type="button" VALUE="Click me!" OnClick="timingex( )">
</form>
Như lúc nãy. Cũng hiện ra một bản như thế này.!!!
Giờ sẽ thêm 2 ví dụ nữa để các bạn cũng như mình hiểu cặng kẽ luôn.
<body>
<script type="text/javascript">
<!--
x=1
function counter( )
{
alert("Chào bạn lần "+x);
x+=1;
setTimeout("counter()",5000);
}
// -->
</script>
<form>
<input type="button" VALUE="Click me!" OnClick="counter( ) " />
</form>
Như vậy nếu bạn thực hiện như trên thì nó sẽ trả về liên tục như thế này. Mỗi 5
giây sẽ trả về 1 bản thông báo VD như 2 bản dưới.
Nó có thể hoạt động liên tục nếu bạn không tắt cái trình duyệt.
Thêm cái này nữa:
<script type="text/javascript">
<!--
x=0
function counter(form)
{
x+=1;
window.status = "Bạn đã nhấn vào nút được " +x+" giây rồi đó !" ;
setTimeout("counter()",1000);
}
// -->
</script>
<form>
<input type="button" VALUE="Click me!" OnClick="counter(this.form)" />
</form>
Khi bạn nhấn vào Click me thì dưới thanh Status Bar ( Thanh Trang thái) sẽ
xuất hiện một dòng “Bạn đã nhấn nút được x giây rồi đó !”
Tùy từng mục đích mà bạn áp dụng cái trên như thế nào
VD:
Cái trên còn có thể dùng để đếm thời gian bạn ở trên trang web đươc bao lâu
bằng cách bỏ nút button đi và thay thể body là
<body onload= “counter() ”>
Như thế này
<body onload="counter();">
<script type="text/javascript">
<!--
x=0
function counter()
{
x+=1;
window.status = "Bạn đã vào trang này được " +x+" giây rồi đó !" ;
setTimeout("counter()",1000);
}
// -->
</script>
</body>