Question

我失去了一点 - 我从jquery演示页面中取了一个弹出式示例作为模板......

如果我将弹出窗口放在第一页，它可以工作 - 我可以在js脚本中调用它来打开它。

因此......以下工作

    <div data-role="page" class="page" id="Menu">
    <div data-role="header" data-position="fixed" class="ui-title center">
        <div data-role="controlgroup" data-type="horizontal">
            <a href="#" class="ui-btn ui-corner-all ui-icon-user ui-btn-icon-notext">&nbsp;</a>
            <a href="#OrderList" class="ui-btn ui-corner-all width150 htitle OrderList">&nbsp;<span class='htitle'>Barserver.com</span>&nbsp;</a>
            <a href="#" class="ui-btn ui-corner-all ui-icon-gear ui-btn-icon-notext">&nbsp;</a>
        </div>
    </div>
    <div id="MainContent">
        <div id="MenuList"></div>    
    </div>
<div data-role="popup" id="popup" data-overlay-theme="b" data-theme="b" data-dismissible="false" style="max-width:400px;">
        <div data-role="header" data-theme="a">
        <h1>Delete Page?</h1>
        </div>
        <div role="main" class="ui-content">
            <h3 class="ui-title">Are you sure you want to delete this page?</h3>
        <p>This action cannot be undone.</p>
            <a href="#" class="ui-btn ui-corner-all ui-shadow ui-btn-inline ui-btn-b" data-rel="back">Cancel</a>
            <a href="#" class="ui-btn ui-corner-all ui-shadow ui-btn-inline ui-btn-b" data-rel="back" data-transition="flow">Delete</a>
        </div>
</div>

我可以通过

动态打开它

$("#popup").popup("open");

但是，如果我将弹出窗口移动到同一文档中的另一个（数据角色）页面，则不会显示它，也不会显示console.log中的错误。任何人都可以引导我前进吗？以下不起作用......

<div data-role="page" class="page" id="OrderList">
    <div data-role="header" data-position="fixed" class="ui-title text-center">
        <div data-role="controlgroup" data-type="horizontal">
            <a href="#Menu" class="ui-btn ui-corner-all ui-icon-carat-l ui-btn-icon-notext Menu">&nbsp;</a>
            <a href="#Menu" class="ui-btn ui-corner-all width150 htitle Menu">&nbsp;<span class='htitle'>Barserver.com</span>&nbsp;</a>
            <a href="#Customer" class="ui-btn ui-corner-all ui-icon-carat-r ui-btn-icon-notext">&nbsp;</a>
        </div>
    </div>
    <div id="OrderListContent" class="productdhtml ui-content"></div>
<div data-role="popup" id="popup" data-overlay-theme="b" data-theme="b" data-dismissible="false" style="max-width:400px;">
            <div data-role="header" data-theme="a">
            <h1>Delete Page?</h1>
            </div>
            <div role="main" class="ui-content">
                <h3 class="ui-title">Are you sure you want to delete this page?</h3>
            <p>This action cannot be undone.</p>
                <a href="#" class="ui-btn ui-corner-all ui-shadow ui-btn-inline ui-btn-b" data-rel="back">Cancel</a>
                <a href="#" class="ui-btn ui-corner-all ui-shadow ui-btn-inline ui-btn-b" data-rel="back" data-transition="flow">Delete</a>
            </div>
    </div>
        </div>

为了避免误解 - 第一个代码示例正常工作，第二个代码示例不起作用（意味着没有错误，不会显示类似对话框的模态）。

为什么？

（当然，所有帮助都很受欢迎）

Answer 1

我明白了（感谢@Omar指导）。编码答案并不容易，但我会尝试草稿并在几天内分享（由于试图解决这个问题，我落后于工作）。

就本说明而言，当我说＆＃34;这次失败＆＃34;我的意思是＆＃34;没有弹出窗口，地址栏没有变化，没有控制台错误。＆＃34;

我有一张表格。如果操作员试图离开，则应进行测试以确认输入了所有数据。我的所有a-href标签都有页面引用， jquery优先于a-href标签，而不是我应用的任何其他事件。我没有考虑过这种情况的后果。结果？表格显示，未完全填写，操作员选择在其他地方导航，弹出呼叫开始/结束但是＆＃34;失败＆＃34;和jquery快速导航到a-href页面中命名的页面。

解决方案：使用弹出窗口时，请勿在a-href标记中命名页面。因此，在使用弹出窗口时，请避免

<a href='#Page5'>Page 5</a>

而是

<a href='#' id='page5'>Page 5</a>

并创建一个事件，决定是否应显示一个弹出窗口，如果没有，则应该导航到该页面。

我希望这是有道理的。

Popup在jquerymobile中无法正常工作

1 个答案: