【问题标题】:Opening a popup window from another popup从另一个弹出窗口打开一个弹出窗口
【发布时间】:2012-12-12 19:34:13
【问题描述】:

我的网站是用 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');
}

没有用。

有人有解决办法吗?

【问题讨论】:

  • function ShowSecond() { $('#MyFirstPopup').popup('close'); $('#MySecondPopup').popup('open'); } 在id前使用#。
  • 在我用#的我的网站上,只需编辑问题已被删除..我再次编辑了问题
  • 你有什么错误吗?

标签: javascript jquery css jquery-mobile popup


【解决方案1】:

首先不要在 a 标签上直接使用 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 函数。设置您需要/想要的任何超时时间。

【讨论】:

    【解决方案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');
    }
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2023-03-20
      • 1970-01-01
      • 1970-01-01
      • 2019-04-14
      • 2015-04-10
      • 1970-01-01
      相关资源
      最近更新 更多