使用jQuery模板动态创建jQuery Mobile页面 [英] Dynamically creating jQuery Mobile pages using jQuery Templates

问题描述

我正在使用jquery mobile构建用于UI和jquery模板以处理html的锻炼目录.借助.page()函数，我能够将html附加到已创建的页面上，并使jquery mobile更改标记.

I am building a workout catalog using jquery mobile for the UI and jquery templates to deal with the html. I have been able to append html to an already created page AND get jquery mobile to change the markup thanks to the .page() function.

但是，我希望能够创建新的jq移动页面.我可以将代码插入到具有data-role = page的div中，对其调用.page()，一切都很好.但是，将完整的页面附加到正文上是行不通的.

However, I want to be able to create new jq mobile pages. I can inject code into divs with data-role=page, call .page() on it and it's all fine. But appending a fully made page to the body does not work.

这个问题和我的答案是指 jquery mobile alpha 3

This question and my answer refers to jquery mobile alpha 3

推荐答案

好的，我明白了.如果要向DOM添加一个，则还必须为data-url添加一个值.创建静态html页面时，

Ok I got it. If you want to add a to the DOM you have to also add a value for data-url. When you create a static html page,

<div data-role="page" id="home">

jQuery mobile会自动添加一个等于您提供的ID的数据URL.亲自操作时，您必须握住它的手并将数据URL ="home"传递给它.

jQuery mobile automatically adds a data-url equal to the id you give it. When you do it yourself, you have to hold its hand and pass it a data-url="home".

当您生成html字符串时，将其附加到$ .mobile.pageContainer上，以便jQuery Mobile知道在哪里可以找到它(将它附加到主体上也可以，但是最好不要动摇). 之后，在DOM中的页面上调用.page()，以便jQuery mobile发挥其所有神奇的<span>魔力使其变得漂亮.

When you generate your html string append it to $.mobile.pageContainer so jQuery Mobile knows where to find it (appending it to the body works also, but it's probably best not to rock the boat). After that, call .page() on your page in the DOM so that jQuery mobile does all of its magical <span> magic to make it pretty.

$('#home').page();

这篇关于使用jQuery模板动态创建jQuery Mobile页面的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！