0

如何修改下面的代码，以便当进度条完成加载并到达末尾时，可以执行单独的函数（即 test() ），而不是像现在这样重复和重复。

<html> 
    <head> 
        <script type="text/javascript"> 
        var prg_width = 200; 

        function progress() { 
            var node = document.getElementById('progress'); 
            var w    = node.style.width.match(/\d+/); 

            if (w == prg_width) { 
                w = 0; 
            } 

            node.style.width = parseInt(w) + 5 + 'px'; 
        } 

        </script> 
    </head> 

    <body onload="var progress_run_id = setInterval(progress, 30);"> 

        <div style="border: 1px solid #808080; width:200px; height:5px;"> 
            <div id="progress" style="height:5px; width:0px; background-color:#DBDBDB;"/> 
        </div> 

    </body> 
</html>

非常感谢和感谢您的所有帮助。

干杯，

周杰伦

4

4 回答 4

1

调用这个单独的函数而不是

w = 0;

线。也不要忘记clearInterval(progress_run_id)。

于 2012-09-11T16:57:40.180 回答
0 
  var prg_width = 200; 

        function progress() { 
            var node = document.getElementById('progress'); 
            var w    = node.style.width.match(/\d+/); 

            if (w == prg_width) { 
                test(); // CHANGE THIS
                clearInterval(progress_run_id);
            } 

            node.style.width = parseInt(w) + 5 + 'px'; 
        }

检查宽度是否等于完成的宽度。如果是，则清除间隔，然后调用您的test函数。

于 2012-09-11T16:56:57.760 回答
0 
<script type="text/javascript"> 
        var prg_width = 200; 

        function progress() { 
            var node = document.getElementById('progress'); 
            var w    = node.style.width.match(/\d+/); 

            if (w == prg_width) { 
                test(); 
                clearInterval(progress_run_id);
            } 

            node.style.width = parseInt(w) + 5 + 'px'; 

        } 

        </script>
于 2012-09-11T16:59:26.123 回答
0 
<html> 
<head>
<script type="text/javascript"> 
var prg_width = 200; 
var progress_run_id = null;

function progress() { 
var node = document.getElementById('progress'); 
    var w  = node.style.width.match(/\d+/); 
    if (w == prg_width) { 
        clearInterval( progress_run_id );
        w = 0;
    } else {
        w = parseInt(w) + 5 + 'px';             
    }
    node.style.width = w;
}
function initialize(){
    progress_run_id = setInterval(progress, 30);
}
window.onload = initialize();
</script> 
</head> 
<body> 
        <div style="border: 1px solid #808080; width:200px; height:5px;"> 
        <div id="progress" style="height:5px; width:0px; background-color:#DBDBDB;"/> 
        </div> 
</body> 
</html>
于 2012-09-11T17:09:01.707 回答