如何在添加元素到DOM後調整jQuery Mobile頁面的大小？

Question

我有一個jQuery Mobile的（1.0.1）頁面具有固定頁腳：

<footer data-role="footer" data-position="fixed"> 
    <a href="#">Click Me!</a> 
</footer> 

當我添加元素的DOM，頁腳欄（這顯然不應該移動）滾出的底部屏幕 - 根據添加到DOM的元素的高度。 （灰色）頁面的上一個結尾和頁腳欄的新位置之間也有白色背景。

如果向下滾動並備份，格式化將被糾正。

我使用的是Chrome，但它也出現在Mobile Safari和IE中。

，增加元素到DOM的代碼是：

$("footer a").click(function() { 
    $("div[data-role='content']").append($("<button>Button A</button>"), $("<button>Button B</button>"), $("<button>Button C</button>"), $("<button>Button D</button>")); 

    $("div[data-role='content']").trigger("create"); 
}); 

我缺少什麼？

Answer 1

您是否嘗試過調用JQM updatelayout事件？

查看此page瞭解更多信息。

嘗試這樣：

$("div[data-role='content']").trigger("create").trigger('updatelayout');