javascript - 使用外部页面创建对话框 JQuery Mobile

Question

我想创建两个页面，第一个包含将显示第二个的按钮，第二个 g 以对话框的形式出现。

data-role= dialog

对于第一页，我将此 codd 添加到添加按钮

$('#header-left-container').prepend(results.rows.item(i).LibelleTypeTravail +"" +
                "<br>" +
                "<a  href='../prestation_html/list_rubrique.html' data-transition='flip' data-rel='dialog'  > <img src='../js/images/add.png' > </a>" +
                "<textarea rows='6'  cols='60'  name='"+results.rows.item(i).LibelleTypeTravail+"'> </textarea><br><br>" );

对于第二页“list_rubrique.html”，我添加了这个：

<div data-role='page'>

<div data-role="data-role="dialog"  id="popupBasic" data-theme="a" >

<ul>
<li>a</li>
<li>b</li>
<li>c</li>
</ul>

</div>
</div>

但不起作用

Answer 1

问题是您的对话框嵌套在页面内，对话框应该独立存在。

要显示对话框，您有两个选择，要么使用常规页面，要么在链接中使用data-rel="dialog"，或者data-role="page"在目标页面上不使用 ，而使用data-role="dialog".

例如，在您的情况下，您应该能够将list_rubrique.html页面中的标记切换为

<div data-role="data-role="dialog"  id="popupBasic" data-theme="a" >   
  <ul>
      <li>a</li>
      <li>b</li>
      <li>c</li>
 </ul>   
</div>