Javascript setTimeout递归不会'不适用于Chrome和Firefox

Javascript setTimeout-recursion doesn't work with Chrome and Firefox

本文关键字：适用于 不适用 Chrome Firefox 递归 setTimeout Javascript      更新时间：2023-09-26

下面的代码用于将一个div滑入另一个隐藏的溢出div（用于未来网站的概念）。"下一个"answers"上一个"链接下方的文本框用于指示x值。有了IE8，一切都很好。

对于Chrome和Firefox，它似乎只执行一次（一步）功能，包括"next"answers"prev"，这意味着setTimeout不会运行。

<html>
    <meta http-equiv="Content-Script-Type" content="text/javascript">
    <head>
        <script type="text/javascript">
            var ie5 = (document.all && document.getElementById);
            var ns6 = (!document.all && document.getElementById);
            function next(startx, fadeStep, end){
                if(startx > end){
                    startx -= Math.round((1/Math.pow(fadeStep,0.6)));
                    if (startx < end) startx = end;
                    document.getElementById('lastname').value = startx + "px";
                    document.getElementById('test1').style.left = startx + "px";
                    fadeStep += 0.00035;
                    args = "next(" + startx + "," + fadeStep + "," + end + ")";
                    setTimeout(args, 20); 
                }
            }
            function prev(startx, fadeStep, end){
                if(startx < end){
                    startx += Math.round((1/Math.pow(fadeStep,0.6)));
                    if (startx > end) startx = end;
                    document.getElementById('lastname').value = startx + "px";
                    document.getElementById('test1').style.left = startx + "px";
                    setTimeout('prev(' + startx + ',' + (fadeStep+0.00035) + ',' + end + ')', 20);
                }
            }
        </script>
    </head>
    <body>
        <div style="position:relative;width:570;height:78;overflow:hidden">
            <div id="test1" style="position:absolute;left:0px;top:0px;width:1180;height:78">
                <img src="http://img38.imageshack.us/img38/7225/imageva.png" border=1>
                <img src="http://img577.imageshack.us/img577/5554/image2te.png" border=1>
            </div>
        </div>
        <div style="position:absolute;left:900px;top:0px;width:800">
            <a href="#" onclick="next(0, 0.001, -570)">Next</a><br />
            <a href="#" onclick="prev(-570, 0.001, 0)">Previous</a></ br>
            <form><input type="text" id="lastname" value="gfgfg"/></form>
        </div>
    </body>
</html>

你能帮忙吗？

在这种情况下，使用setTimeout可能是更好的方法，如下所示：

window.setTimeout(function() { next(startx, fadeStep, end); } , delayInMiliseconds);

然而，缺少"window."对象前缀可能是您的功能无法在这些浏览器中工作的另一个原因。

如果你还有其他问题，请毫不犹豫地问。

如注释中所述，使用jQuery将节省大量时间。

致问候，

相关文章：