如何在Iphone的safari或android的webkit上的DIV中動態滾動內容？

Question

我的代碼：

for(var myLine = 0; myLine < 100; myLine++)
      document.getElementById("myDiv").innerHTML += "line " + myLine + "<br>";


...............

<div style="position:...etc; overflow:auto;" id="myDiv"></div>

這在所有非移動平台上的每個瀏覽器中都沒有任何故障。 但是......當在iPhone（Safari）或Android（webkit）上實現時，div會填充文本，但是當文本超過div的高度並且用戶無法“推送”時，不會生成滾動條內容也是如此。 因此無論如何，有效溢出總是“隱藏”。

我很好奇是否有一些我正在忽視的替代方法，或者這只是一個我現在無法繞過的錯誤。

Answer 1

這是移動webkit上的一個已知問題： http ： //www.quirksmode.org/webkit.html 。 尋找overflow 。

解決方案是iScroll 。

Answer 2

實際上，iOS表現正常。 用戶必須使用兩根手指滾動頁面上不是整頁的任何滾動區域。 （否則當瀏覽器在非優化頁面上填滿屏幕時，瀏覽器如何知道用戶是否想要滾動div或它的容器。）

解決'功能'的最佳方法是實現一個觸摸事件處理程序，當用戶觸摸它時將其移動。 實踐中一個很好的例子是Apple的FingerTips示例代碼。

當您在iPad上瀏覽Safari Developer Library時，Apple會使用這種技巧。

Answer 3

我認為問題在於設置innerHTML，這里是類似的帖子 。

在dom加載並准備就緒后，是否在iPhone上調用了該功能？