jquery - 数据转换不适用于外部链接

Question

<div data-role="header" id="header"> <h1>Qsr Food</h1> <a href="info.html" rel="external" data-icon="info" data-iconpos="notext" data-rel="dialog" data-transition = "flip" class="ui-btn-right">info</a> </div><!------- header div-----> <div data-role="content" id="content"> </div><!----- main div------->

这是 info.html 代码

<div data-role="dialog" id="info" data-theme="e" data-transition="flip"> <div data-role="header"> <h1>About View Source</h1> </div>

<div data-role="content">
<p> View Source offers short projects on intermediate to advanced web design topics, coveing technologies such as HTML, PHP< JQuery, and CSS, as well as content management solutions like WordPress and integration with Twitter, YouTube, and more.</p>
</div>

我怎么了

Answer 1

添加rel=external将有效地停止过渡。为了data-transition工作，请加载与info.html第一页本身相关的脚本并rel = external从您的链接中删除。

对于对话框，删除rel=external就可以了。不需要额外的 JavaScript。让魔法自己发挥作用:-)

额外参考

• 对话框小部件 API 文档

重要的

这些方法在 chrome 桌面版中不起作用，但在移动版中起作用。rel= external除了使用chrome之外别无他法。

Answer 2

要将外部 HTML 作为对话框打开，请使用以下代码

HTML - 使用 id 链接到您的 dialog.html dialog。

<a href="#" id="dialog" data-icon="info" data-iconpos="notext">info</a>

jQuery 移动

$(document).on('click', '#dialog', function() {
 $.mobile.changePage('dialog.html', { role: 'dialog', transition: 'flip' });
});