遞歸與alertify.js導致自動關閉警報

我想下面的老同學片段轉換爲alertify.js 0.3.8：遞歸與alertify.js導致自動關閉警報

window.doPrompt = function() { 
    var str; 
    do str = prompt("Enter your name"); 
    while (str === "" && (alert("Can't be empty!") || true)); 
    if (str) document.getElementsByTagName("body")[0].innerHTML += ("<pre>Your name is: " + str + "</pre>"); 
}

JSFiddle of the above

這是我第一次嘗試：

window.doPrompt = function() { 
    alertify.prompt(
    "Enter your name", 
    function(confirmed, str) { 
     if (confirmed) { 
     if (str.length === 0) { 
      alertify.alert(
      "Can't be empty!", 
      function() { doPrompt(); } 
     ); 
     } else { 
      document.getElementsByTagName("body")[0].innerHTML += ("<pre>Your name is: " + str + "</pre>"); 
     } 
     } 
    } 
); 
}

JSFiddle of the above

它不按預期工作。例如，在Firefox 19中，如果您使用鍵盤將提示提交爲空，則「錯誤」警報將僅顯示很短的時間，然後會自行消失，這不是以前的工作方式。

我試圖通過在每個alertify調用周圍插入調用window.setTimeout並將超時設置爲0來中斷遞歸。它沒有幫助。

如果你可以推薦一個替代JavaScript庫，並且可以使用我可以使用的類似API（當然沒有這個問題）。

來源

2013-02-28 Janus Troelsen

它似乎沒有與alertify.js，但與Firefox的問題。如果您搜索bugs related to transitionend（在對話動畫中使用，根據the sources），您會看到您遇到的問題的一些潛在候選人（特別是"transitionend event not fired when there are multiple transitions"）。這與您所遇到的情況一致 - 如果您嘗試顯示一個對話框，而其他對話框仍然存在（即之前的對話框仍處於轉換中），則情況會中斷。

雖然我可以提供解決方法。這並不漂亮，但完成了工作。但首先，一個不相關的問題，我發現在所有的瀏覽器：

庫似乎如果附加的東西到body變得混亂;使用「目標」 div，而不是解決問題：

<div id="target"></div> 
... 
document.getElementById("target").innerHTML += ("<pre>Your name is: " + str + "</pre>");

均顯示一個警告，當再次顯示提示時，你應該使用setTimeout如你所說。但是，暫停時間爲零是不夠的，因爲這裏的問題在transitionend上。設置足夠高的前面的對話框，完成隱藏的值，這個問題是固定的：
```
 setTimeout(function() { 
      alertify.alert(
      "Can't be empty!", 
      function() { 
       setTimeout(function() { 
        doPrompt(); 
       }, 500); 
      } 
     ); 
     }, 500); 
```
（如果該值不夠高，這不僅會繼續上破的Firefox也將打破曾經工作的瀏覽器像Chrome一樣，所以請記住）

Working example。在Firefox 19.0，Chrome 25和Safari 4.0.4中成功測試。

來源

2013-03-02 07:24:26 mgibsonbr

遞歸與alertify.js導致自動關閉警報

回答

相關問題