html5 progress

最新推荐文章于 2023-02-14 15:43:17 发布

曹振华

最新推荐文章于 2023-02-14 15:43:17 发布

阅读量432

点赞数

分类专栏： html5 文章标签： html5 progress

本文链接：https://blog.csdn.net/chadcao/article/details/51987424

版权

html5 专栏收录该内容

18 篇文章 0 订阅

订阅专栏

<!doctype html>
<html>
<head>
    <title>progress</title>
    <script type="text/javascript" src="javascript/jquery.js"></script>
    <script type="text/javascript">
        var currentValue = 0;//进度条当前数据
        var maxValue = 100;//进度条最大值
        var myIndex;
        $(function () {
            $('#myProgress').val(currentValue);
            $('#myProgress').attr('max', maxValue);
            myIndex = setInterval(plusValue, 100);
        });
        function plusValue() {
            if (currentValue < maxValue) {
                currentValue++;
                $('#myProgress').val(currentValue);
            } else {
                clearInterval(myIndex);
                alert('加载完成');
            }
        }
    </script>
</head>
<body>
    <progress id="myProgress" ></progress>
</body>
</html>