如何使用 jQuery Mobile 手动触发页面创建
How can I manually trigger page creation with jQuery Mobile?
我正在使用MVC js lib(emberjs),它将动态创建和更改页面(视图)。如何使用 jQuery Mobile 手动触发页面创建?
这是我的 jsFiddle - http://jsfiddle.net/mattkime/Aczye/3/
将创建一个带有页眉和页脚的 jQuery Mobile 页面。在 1 秒的设置超时后,该页面将从 DOM 中删除,并插入新内容,但无法显示。你会看到我失败的代码。
(注意,路由在由 Ember 处理时关闭)
如何让新标记显示为 jQuery Mobile 增强型页面?
法典:
/** disables jQM routing **/
$(document).bind("mobileinit", function () {
$.mobile.ajaxEnabled = false;
$.mobile.linkBindingEnabled = false;
$.mobile.hashListeningEnabled = false;
$.mobile.pushStateEnabled = false;
});
// removes hidden pages
$('div[data-role="page"]').live('pagehide', function (event, ui) {
$(event.currentTarget).remove();
});
var pageTwo = '<div id="pageTwo" data-role="page"><div data-role="header"><h1>header2</h1></div> <div data-role="content">...</div><div data-role="footer" data-position="fixed"><h1>footer2</h1></div></div>';
setTimeout(function(){
$('#pageOne').remove();
$('body').append(pageTwo);
$('#pageTwo').page();
//alert($('#pageTwo').length);
//$.mobile.changePage($('#pageTwo'));
},1000);
不要删除第 1 页,否则无法从第 2 页过渡到第 2 页。
http://jsfiddle.net/Aczye/4/
/** disables jQM routing **/
$(document).bind("mobileinit", function () {
$.mobile.ajaxEnabled = false;
$.mobile.linkBindingEnabled = false;
$.mobile.hashListeningEnabled = false;
$.mobile.pushStateEnabled = false;
});
// removes hidden pages
$(document).delegate('div[data-role="page"]', 'pagehide', function (event, ui) {
$(event.currentTarget).remove();
});
var pageTwo = '<div id="pageTwo" data-role="page"><div data-role="header"><h1>header2</h1></div> <div data-role="content">...</div><div data-role="footer" data-position="fixed"><h1>footer2</h1></div></div>';
setTimeout(function(){
//$('#pageOne').remove();
$('body').append(pageTwo);
$.mobile.changePage("#pageTwo");
//alert($('#pageTwo').length);
//$.mobile.changePage($('#pageTwo'));
},1000);
编辑:更新为使用.delegate
进行未来证明。 由于某些jQuery移动版本仍然需要旧版本的jquery,因此.bind
相关文章:
- 在创建时使用 Sequelize 保存时获取关联
- 在 JavaScript 循环中创建和使用变量
- 如何迭代数据为谷歌地图创建标记(使用express/jquery/ajax)目前正在获取SyntaxError
- 用javascript创建对象(使用新对象)有什么优点
- 如何创建可以使用 AngularJS 上的控制器访问的帮助程序类
- 创建可以使用 HTML 5 平移和缩放的大型图形的最佳方法
- 创建一个使用其他 js 库的可嵌入 JavaScript 小部件
- 如何检查cookie是否存在,即使它是在其他应用程序中创建的?(使用 JS 或 C#)
- 多个页面之前创建由使用 jsfiddle 的嵌套列表视图引起的事件
- NodeJS - 创建一个使用 Sequelize 函数的 Promise 函数
- 是否可以创建一个使用选择器名称的jQuery函数
- 创建一个使用javascript函数的ActionLink
- JavaScript 和 jQuery,创建和使用一个对象.属性返回未定义
- 在less.css中创建和使用用户函数
- 创建和使用iOS设置.在PhoneGap中使用JavaScript绑定值
- 创建JS:使用"容器”;
- 使用传单创建圆(使用正半径)
- Javascript如何创建和使用带有纯二进制数据的blob
- 如何创建一个使用http的工厂.Get并把它传递给angular中的多个控制器
- 创建一个使用ng-model并具有唯一作用域的指令