使用jQuery Mobile刷新表单页面

refresh form page with jQuery Mobile

本文关键字：表单 刷新 jQuery Mobile 使用      更新时间：2023-09-26

在我的移动网站中，我动态地创建了一个javascript表单，所以我需要"重新加载"页面以获得jQuery移动样式。对于listview，我们可以简单地调用$("#mylistview").listview("refresh")，但是form没有这样的功能。

我知道我们可以对表单的每个元素调用"refresh"，但是这样做，样式就不能正确应用。事实上，我所有的复选框是分开的，它们不会出现在一个"inset"

中。

发布说明中的文档:

  • http://jquerymobile.com/blog/2011/08/03/jquery-mobile-beta-2-released/

的例子:

$('#nameOfPage').trigger('create');

:

新增"create"事件:一次轻松增强所有小部件

当页面插件不再特定地调用每个插件时，它调度"pagcreate"事件，大多数小部件使用auto-initialize本身。只要一个小部件插件脚本是引用后，它将自动增强小部件的任何实例它在页面上找到，就像以前一样。例如，如果选择菜单插件加载，它将增强任何选择，它发现在一个新的创建页面。

这个结构现在允许我们添加一个新的创建事件，可以是在任何元素上触发，从而节省了手动初始化的任务该元素中包含的每个插件。直到现在，如果一个开发人员通过Ajax或动态生成的标记加载内容需要手动初始化所有包含的插件(列表视图按钮，选择等)来增强标记中的小部件。

现在，我们方便的create事件将初始化所有必要的插件在这个标记中，就像如何增强页面创建一样流程工作。如果要使用Ajax加载HTML块标记(比如登录表单)，可以触发自动创建转换其中包含的所有小部件(输入和按钮)Case)转换为增强版本。这个场景的代码是: 
$( ...new markup that contains widgets... ).appendTo( ".ui-page"
 ).trigger( "create" );

Create和refresh的重要区别

注意，create事件之间有一个重要的区别以及一些小部件的刷新方法。创建事件是合适的用于增强包含一个或多个小部件的原始标记。的某些小部件具有的刷新方法应该用于现有的(已经增强的)以编程方式操作的小部件并且需要更新UI来匹配。

例如，如果您有一个页面，您动态地添加了一个新的在页面创建后，data-role=listview属性的无序列表在该列表的父元素上触发create将对其进行转换变成一个列表视图样式的小部件。如果更多的列表项是那么通过编程方式添加，调用listview的refresh方法将将这些新列表项更新为增强状态，并将现有列表项不受影响。

相关文章：