Question

我正在创建一个针对iOS设备的网络数据库驱动的离线网络应用。我正在尝试使用jQuery Mobile，但我在创建各种表单时遇到了问题。

表单选项取自数据库查询，因此它们在加载后插入页面，因此“jQuery-Mobilification”不会发生。快速查看源代码，在这个阶段似乎没有任何明显的方法可以调用它（当然它是alpha版本，我认为这将是一个相当普遍的请求，所以我希望它将会来）。我可以采用某种解决方法吗？我对单选按钮，复选框和选择列表特别感兴趣。

Answer 1

<强>更新

Beta2发生create事件。当beta2发布时我会更新我的常见问题。见http://jquerymobile.com/blog/2011/07/22/jquery-mobile-team-update-week-of-july-18th/

更新了常见问题：http://jquerymobiledictionary.pl/faq.html

正如CaffeineFueled所提议的那样 - .page()是让JQM与HTML的任何部分一起工作的方法

.page()只能为元素调用一次。在添加到页面的包装元素上调用它。它应该处理所有事情。

Answer 2

当前选择的答案略有过时。使用“刷新”而不是“页面”来设置动态添加内容（列表或表单）的样式。

如果您将项目添加到列表视图中，那么您将会这样做需要调用refresh（）方法它来更新样式并创建任何样式添加的嵌套列表。对于例如，$('ul').listview('refresh');

通过jQuery Mobile docs, 1.0.4a

Answer 3

在AJAX调用完成并插入表单元素后，请尝试调用：

$("#the-page-id").page();

我相信jquery-mobile团队将在各种UI元素上添加.refresh（）方法，以便将来解决此问题。

Answer 4

这在无证内幕中乱七八糟，但以下内容对我有用：

$("#some-div").load("/html/fragment/", 
                    function() { 
                      $(this).find("input").customTextInput();  
                    });

按钮，复选框等等有相同的方法。

查看http://code.jquery.com/mobile/1.0a1/jquery.mobile-1.0a1.js中的_enchanceControls [原文如此]方法。

1.0Alpha2的更新：在使用库的内部时可以预期，这在最新版本中不再有效。将customTextInput()更改为textinput()会稍微修复一下，但主题因某些原因未完全应用。我们被警告了......

Answer 5

是的，问题就像你描述的那样。文档准备就绪时会触发“动员”。但是，由于您的脱机数据库查询是异步的，因此会在触发document.ready之后结束。因此，DOM会在稍后的过程中更新，并且不会将额外的CSS添加到所有div和列表项中。

我认为您必须将移动设备js的源更改为不在文档就绪状态下运行，而是在告诉它运行时运行。然后你必须在数据库回调中调用该函数。

看起来这是目前唯一的选择。

传统上我使用jqtouch和现在的sencha。我没有玩过jQuery mobile。

替代 - 您可以在使用必要的CSS样式从数据库中查询HTML后写出HTML。如果您使用Firefox的Firebug插件，您可以看到在动员运行时应用了哪些样式/类。您可以使用这些约定来编写HTML。不理想，但会奏效。

Answer 6

naugtur是对的，你必须在你添加到dom的任何元素上调用.page（），然后它很好用：

var el = $('<input type="text"/>')
el.page();
$('#something').append(el);

Answer 7

这对我有用（jquerymobile1.7.0）：

$('#formular').append('<div data-role="fieldcontain" class="ui-hide-label">' +
'<label for="name" class="ui-hidden-accessible">Name:</label>' +
'<input type="text" name="name" size="25" id="name" placeholder="Name"/>' +
'</div>');  
$('#name').textinput();

目前所有类型的表单元素（例如，滑块，文本输入等）都有所谓的插件函数来创建它们。

Answer 8

以下是Tom谈到的此功能文档的链接。不确定它们何时被添加，但我正在使用它，它对我有用！

http://jquerymobile.com/test/docs/forms/plugin-eventsmethods.html

jQuery Mobile - 动态创建表单元素

8 个答案: