JQuery Mobile - 在显示页面之前调整表单元素的大小答案

【问题标题】：JQuery Mobile - Resize Form Elements Before Displaying PageJQuery Mobile - 在显示页面之前调整表单元素的大小
【发布时间】：2012-10-04 21:22:23
【问题描述】：

我正在调整 JQM 控制按钮组的大小以适应其包含的 DIV 的宽度。

但是，我想在用户看到任何内容之前执行此操作。目前，我只能在页面显示后才能完成这项工作，这就像一个小故障。

这是我的调整大小代码：

var myWidth = $(window).width() - 1.3*($(window).width() - $('#eventForm').width());
$('.eStatusLabel').css("width", myWidth/3);

这是我尝试使用的触发此事件的函数，但 #eventForm 宽度始终为 0：

$("#myPage").live('pageinit',function(){ //Resize});
$("#myPage").live('pageload',function(){ //Resize});
$("#myPage").live('pagebeforeshow',function(){ //Resize});

有没有办法在显示之前获取表单的大小？是否有另一种方法可以在不包含 data-role="page" 填充的情况下获取内容页面的内部宽度？

谢谢

【问题讨论】：

这是针对移动网站还是响应式网站？
尝试在应用宽度之前隐藏元素并在应用宽度后显示。

标签： jquery css jquery-mobile

【解决方案1】：

唯一可行的方法是覆盖默认的 jquery-mobile css。您可以在页面加载后将 id 分配给父元素，并在页面加载后获得的 id 前面定义宽度和其他属性。这个概念就像通过 ajax 加载一个 html 内容，然后将 css 应用于该 html。

【讨论】：