Đỉnh NGUYỄN

life's a journey not a destination

Hiển thị số đếm dùng jQuery

Leave a comment


Có một cách đơn giản hiển thị số đếm dùng jQuery

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Display a Counter</title>
    <style type="text/css">
        #displayCounter {
            font-size: 42px;
            font-family: Georgia;
        }
    </style>
    <script type="text/javascript" src="http://ajax.microsoft.com/ajax/jQuery/jquery-1.4.2.min.js"></script>
    <script type="text/javascript">
        $(function () {
            var cnt = 0; var counter = setInterval(function () {
                if (cnt < 20) {
                    $('#displayCounter').html(cnt); cnt++;
                } else {
                    clearInterval(counter);
                    $('#displayCounter').html("Timeout!!");
                }
            }, 1000);
        });
    </script>
</head>
<body>
    <div id="displayCounter"></div>
</body>
</html>

Số đếm chạy từ 0 đến 20 rồi dừng lại. Có thể thực hiện bất kỳ hành động nào khi số đếm dừng lại. Với ý tưởng minh họa, đoạn mã hiển thị chuỗi “Timeout!”.

Advertisements

Author: dinhnn

Senior software developer, a technical leader. You can be reached at via email to dinhnguyenngoc@gmail.com, via my blog at dinhnguyenngoc.wordpress.com, and on Twitter @dinhnguyenngoc.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s