Javascript setTimeout-recursion不適用於Chrome和Firefox

Question

下面的代碼用於在另一個隱藏的溢出div（用於將來的網站的概念）內滑動div。 “下一個”和“上一個”鏈接下方的文本框用於指示x值。 使用IE8，一切正常。

對於Chrome和Firefox，似乎“下一個”和“上一個”僅執行一次功能（一步），這意味着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>

你能幫忙嗎？

Answer 1

在這種情況下，使用setTimeout可能是一種更好的方法，如下所示：

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

但是，缺少“窗口”。 對象前綴可能是導致您的功能無法在這些瀏覽器中運行的另一個原因。

如果您還有其他問題，請隨時提出。

如評論中所述，使用jQuery將節省大量時間。

最好的祝福，

Javascript setTimeout-recursion不適用於Chrome和Firefox

問題描述

1 個解決方案

解決方案1
1 已采納 2012-01-27 20:32:48

Javascript setTimeout-recursion不適用於Chrome和Firefox

問題描述

1 個解決方案

解決方案1 1 已采納 2012-01-27 20:32:48

解決方案1
1 已采納 2012-01-27 20:32:48