Javascript jQuery手机弹出窗口赢得'；页面导航后不显示，仅在硬刷新或返回到同一页面后显示_Javascript_Jquery_Jquery Mobile_Jquery Mobile Popup

Javascript jQuery手机弹出窗口赢得'；页面导航后不显示，仅在硬刷新或返回到同一页面后显示

javascript jquery jquery-mobile

Javascript jQuery手机弹出窗口赢得'；页面导航后不显示，仅在硬刷新或返回到同一页面后显示,javascript,jquery,jquery-mobile,jquery-mobile-popup,Javascript,Jquery,Jquery Mobile,Jquery Mobile Popup,我拥有的我正在使用jquerymobile1.4.4。我在每个标题上添加了一个齿轮按钮，它将打开一个小弹出窗口，在“注销”和“帐户设置”之间导航我想发生的事我希望这个弹出窗口显示在它被点击的每个页面上，每个页面使用相同的代码问题在主页上（称之为A页），我有一个齿轮按钮。当我点击它时，弹出窗口会显示得很好。然后我点击账户设置（称之为B页）。加载页面B后，齿轮也在那里，但不会像页面A那样打开弹出窗口。如果我刷新页面B，齿轮弹出窗口将工作，但一旦我导航回页面A（通过主页按钮），齿轮不再工作，

我拥有的

我正在使用jquerymobile1.4.4。我在每个标题上添加了一个齿轮按钮，它将打开一个小弹出窗口，在“注销”和“帐户设置”之间导航

我想发生的事

我希望这个弹出窗口显示在它被点击的每个页面上，每个页面使用相同的代码

问题

在主页上（称之为A页），我有一个齿轮按钮。当我点击它时，弹出窗口会显示得很好。然后我点击账户设置（称之为B页）。加载页面B后，齿轮也在那里，但不会像页面A那样打开弹出窗口。如果我刷新页面B，齿轮弹出窗口将工作，但一旦我导航回页面A（通过主页按钮），齿轮不再工作，直到我刷新

所述情景的视频：

代码

仅标题和弹出式html（在两个页面上相同）


家


设置

我认为正在发生的事情

我读到这个问题可能是因为弹出窗口的ID是相同的？这没有意义，因为它们是两个不同的页面

也可能是弹出窗口填充在

lapieuvre的问题（作为对手头类似问题的回复）与此完全相同：

非常感谢您的反馈

总结一下答案：

因为弹出窗口的ID是相同的。如果您了解jquerymobile的工作方式，它会通过AJAX获取HTML部分，使之成为一个单页应用程序，这是有意义的

最好使用AJAX，这就是全部想法，只需更改id，最好有一个前缀，以便您识别其父页面，这就是方法。干杯

总结一下答案：

因为弹出窗口的ID是相同的。如果您了解jquerymobile的工作方式，它会通过AJAX获取HTML部分，使之成为一个单页应用程序，这是有意义的

最好使用AJAX，这就是全部想法，只需更改id，最好有一个前缀，以便您识别其父页面，这就是方法。干杯

当我找到这篇文章时，我正在研究同一个问题。对我有效的方法是将弹出div放置在外部工具栏中：

“在Ajax导航过程中，不在页面内的工具栏将不会被拉入DOM。”这样，您就不会有多个具有相同ID的div。

当我发现这篇文章时，我正在研究同一问题。对我有效的方法是将弹出div放置在外部工具栏中：

“在Ajax导航过程中，不在页面内的工具栏将不会被拉入DOM。”这样，您就不会有多个具有相同ID的div。

多亏OP发布了这篇文章，因为这个问题在几天内给我带来了很多困惑。实际上，我的问题略有不同，因为同一个页面显示了这种行为，因此与页面相关的ID无法解决问题

然而，与第一响应者一样，我使用了一个随机数作为弹出ID的一部分，这以类似的方式解决了问题。

但是，与第一响应者一样，我使用了一个随机数作为弹出ID的一部分，这以类似的方式解决了问题。

因为弹出ID是相同的。如果您了解jQuery Mobile的工作方式，它会通过AJAX获取HTML部分，使之成为一个单页应用程序。@SameerShemna因此，我可以使用

data AJAX=false

设置锚定标记，或者更改每个弹出窗口的ID。最好使用AJAX这就是整个想法，只需更改ID，最好使用前缀来标识其父页面，这就是方法。干杯谢谢@SameerShemna，如果你将此作为答案发布，我将接受。因为弹出窗口的ID是相同的。如果您了解jQuery Mobile的工作方式，它会通过AJAX获取HTML部分，使之成为一个单页应用程序。@SameerShemna因此，我可以使用

data AJAX=false

设置锚定标记，或者更改每个弹出窗口的ID。最好使用AJAX这就是整个想法，只需更改ID，最好使用前缀来标识其父页面，这就是方法。干杯谢谢@SameerShemna，如果你将此作为回复，我将接受。

<body>
 <table id="top" border=0 >
 <colgroup>
    <col style="width: 33%"/>
    <col style="width: 33%"/>
    <col style="width: 33%"/>
 </colgroup>
 <tr>
     <td align="left">
         <a href="javascript:window.history.back();" data-role="button" data-icon="back" data-iconpos="notext" data-inline="true">Back</a>
     </td>
     <td id="tdTitle" align="middle" style="padding-top:10px;">
         <h2>Home</h2>
     </td>
     <td align="right">
         <a href="Home.php" data-role="button" data-icon="home" data-iconpos="notext" data-inline="true">Home</a>
         <a href='#settingsPopup' data-rel='popup' data-transition='pop' data-role="button" data-icon="gear" data-iconpos="notext" data-inline="true">Settings</a>
     </td>

 </tr>
</table>  
 <div data-role='popup' id='settingsPopup' >
<ul data-role='listview' data-inset='true' style='min-width:210px;'>
    <li data-role='list-divider'>
        Settings                
    </li>
    <li>
        <a href='AccountSettings.php'>Account Settings</a>
    </li>
    <li>
        <a href='Logout.php'>Logout</a>
    </li>
</ul>
</div>