Question

这是一个非常简单的小提琴：

如果单击标题栏中的“预设”按钮，则会打开一个对话框。如果单击对话框上的“关闭”按钮，而不是返回到它来自的页面，它将转到页面上的最后一页（不包括对话框本身）（内容为This is another page的页面）。怎么会？有没有办法修复自动插入的后退按钮，使其行为正常（如我在对话框中包含的“主页”按钮），或者，如果没有，有没有办法删除关闭按钮。

<div data-role="page" id="index">
    <header data-role="header">
    <h1>Index</h1>
    <a href="#presets" data-icon="star" class="ui-btn-right" data-transition="pop" data-rel="dialog">Presets</a>
    </header>
    <article data-role="content">
        <div>This is the main page</div>
    </article>
</div>
<div data-role="page">
    This is another page
</div>
<div data-role="page" id="presets">
    <header data-role="header">
        <h1>Presets</h1>
        <a href="#index" data-icon="home" data-iconpos="notext"></a>
    </header>
    <div data-role="content">
        This is a dialog!
    </div>
</div>

更新

正如泰丰指出的那样，问题是页面上缺少一个id。添加id修复了我的第一个小提琴。然而，我的实际情况稍微复杂一点，如这个小提琴所示：

http://jsfiddle.net/mmSKj/2/

这里我实际上是使用knockout动态创建页面，我通过数据绑定为这些页面分配ID，但是，看起来，由于某些原因，jQuery Mobile无法识别这些ID。如果您使用Firebug查看，您可以看到ID正确地添加到页面的属性中，但是当您关闭对话框时，您最终会在第3页而不是原始页面上结束。

更新2

简单修复，我刚刚将一个虚拟id添加到html中，其中knockout将用作模板：

<!-- ko foreach: pages -->
<div data-role="page" data-bind="attr: {id: name}" id="dummy">
    This is <span data-bind="text:name"></span>
</div>
<!-- /ko -->

请参阅here。

虚拟ID被淘汰代替，因此链接到该页面正常工作，jQuery mobile似乎很高兴！

Answer 1

将id添加到您的其他页面

<div data-role="page" id="anotherpage">
    This is another page
</div>

然后它会起作用，请参阅jsfiddle

Answer 2

回到另一个解决方案，因为你提到：是否有办法删除关闭按钮？是的，只需添加此样式，另请参阅this answer ...

 <style>
   .ui-dialog .ui-header a[data-icon=delete] {
     display: none;
   }
 </style>

和另一个jsfiddle来证明

对话框上的关闭按钮返回错误的页面

2 个答案: