Question

我的网站是用HTML5，CSS3和Jquery-moblie构建的。

我使用Jquery-mobile弹出窗口。

在弹出窗口中，我有一个按钮，当按下时我希望当前弹出窗口关闭而另一个将打开。

我试过这种方式：

弹出窗口：

    <div id="MyFirstPopup" data-role="popup" data-theme="a" data-overlay-theme="a" class="ui-content">
        <a  data-role="button" data-transition="none" data-theme="b"
            onclick="ShowSecond();" data-icon="forward" data-iconpos="left" >
        </a>
    </div>

    <div id="MySecondPopup" data-role="popup" data-theme="a" data-overlay-theme="a" class="ui-content">
     ...
    </div>

JS：

function ShowSecond()
{
   $('#MyFirstPopup').popup('close');
   $('#MySecondPopup').popup('open');
}

它不起作用。

有没有人有解决方案？

Answer 1

首先，不要直接在标签上使用 onclick =“ShowSecond（）;” 。

我为您创建了一个工作示例：http://jsfiddle.net/Gajotres/8Arrt/

添加点击事件，如下所示：

 $('#popup-button').live('click', function(e) {
     setTimeout(function(){$('#MySecondPopup').popup('open');},500)
     $('#MyFirstPopup').popup('close');
});

或者使用.on（如果你正在使用新的jQuery库。你不能打开新的弹出窗口，除非旧的弹出窗口关闭但你现在也无法在关闭最后一个的事件中打开弹出窗口，因此需要setTimeout函数。无论你需要/想要什么超时。

Answer 2

试试这个：

<div id="MyFirstPopup" data-role="popup" data-theme="a" data-overlay-theme="a" class="ui-content">
    <a id="btOpenSecPopup" data-role="button" data-transition="none" data-theme="b"
        onclick="ShowSecond();" data-icon="forward" data-iconpos="left" >
    </a>
</div>

<div id="MySecondPopup" data-role="popup" data-theme="a" data-overlay-theme="a" class="ui-content">
 ...
</div>

你的js文件

$('#btOpenSecPopup').live('click', function(e) {
    $('#MyFirstPopup').popup('close');
    $('#MySecondPopup').popup('open');
}

从另一个弹出窗口打开一个弹出窗口

2 个答案: