試圖與JavaScript的功能放大的圖像

我有了這個功能：試圖與JavaScript的功能放大的圖像

function zoomImage(i, image, currentWidth, currentHeight, targetWidth, targetHeight){ 
    var widthStep = (targetWidth - currentWidth)/100; 
    var heightStep = (targetHeight - currentHeight)/100; 
    var newWidth = Math.ceil(currentWidth + i * widthStep); 
    var newHeight = Math.ceil(currentHeight + i * heightStep); 
    i++; 
    var imageZ = document.getElementById(image); 
    imageZ.style.width = newWidth+"px"; 
    imageZ.style.height = newHeight+"px"; 
    while(i <= 100) 
     t = setTimeout("zoomImage(i, image, currentWidth, currentHeight, targetWidth, targetHeight)",10); 
}

這樣調用：

zoomImage(0, "image1", 200, 150, 260, 195);

但由於某些原因，頁面將不會停止加載並最終崩潰。此外，圖像不會變大。我在這裏做錯了什麼？

來源

2011-11-19 BobM

每次運行函數「i」上升一次，如果i <= 100，函數只會再次運行。然後函數只運行100次，不是？ – BobM

爲什麼你想要它運行多次？ – ajax333221

AH它應該是一個if，而不是一段時間。 Dx – BobM

我假設你在函數外初始化了i。這是i，當您進行遞歸調用時，始終會通過。這是因爲當您給字符串setTimeout時，它將在全局範圍內進行評估。

這意味着函數內i++僅會影響本地i，而不是全球i，所以i是~~沒有被增加~~不會增加超過1個+全球價值。

而是傳遞一個調用遞歸調用的匿名函數。這樣你實際上傳遞了遞增的i。

while(i <= 100) 
    setTimeout(function() { 
     zoomImage(i, image, currentWidth, currentHeight, targetWidth, targetHeight); 
    },10);

當然，如在評論中指出，while似乎並不喜歡這裏的正確選擇。

來源

2011-11-19 01:09:09 RightSaidFred

它看起來不正確。'while（i <= 100）'..但是'i'在循環中永遠不會增加。 – Esailija

我沒有在函數之外初始化'i'。在函數的第一次調用時爲0，就是這樣。然後它被加強一次並再次作爲參數放入函數中。換句話說，第二個本地'i'是第一個本地'i'加1. – BobM

@BobM：但是當你執行'setTimeout（「zoomImage（i，image，..）時，你沒有傳遞本地'i'。正如我在我的回答中指出的那樣，你的字符串是在全局範圍內進行評估的，如果你沒有全局的'i'，那麼會讓我感到驚訝的是，第一次遞歸調用完全可以工作，因爲他們會傳遞'undefined'作爲'i'的值，這會阻止'while'再次運行。 – RightSaidFred

試圖與JavaScript的功能放大的圖像

回答

相關問題