jquerymobile關閉對話框後打開另一個

在頁面ABC上，我彈出一個jQueryMobile first對話框。jquerymobile關閉對話框後打開另一個

這個對話框有一個按鈕，調用第二個對話框：

<a href="/second" data-role="button" data-rel="dialog">Second dialog</a>

我想點擊該按鈕，用以下成果：

first對話框關閉
second彈出對話框
當我關閉second對話框時，我剩下頁面ABC

但是，什麼情況是這樣的：

second對話框彈出
當我關閉second對話，我留下對話框
現在我必須關閉first對話框，留給first到頁面ABC

jQueryMobile文檔說當任何lin k在對話框中單擊，框架將自動關閉對話框並轉換到請求的頁面，就像對話框是普通頁面一樣。

如何從first對話框中調用second對話框，同時關閉first對話框？

來源

2012-09-05 Daniel May

<head> 
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.1/jquery.mobile-1.1.1.min.css" /> 
<script src="http://code.jquery.com/jquery-1.7.1.min.js"></script> 
<script src="http://code.jquery.com/mobile/1.1.1/jquery.mobile-1.1.1.min.js"></script> 
<script> 
     $(function() { 
      $("#link2").on("click", function(event, ui) { 
       $("dialog1").dialog('close'); 
      } 
     }); 
</script> 

</head> 
<body> 
    <div data-role="page" id="example"> 
      <div data-role="header"> 
      <h1>test</h1> 
      </div> 
      <div data-role="content"> 
      <a href="#dialog1" data-rel="dialog" id="link1">Open dialog1</a> 
     </div> 
    </div> 
    <div data-role="page" id="dialog1"> 
      <div data-role="header"> 
      <h1>dialog1</h1> 
      </div> 
      <div data-role="content"> 
      <a href="#dialog2" data-rel="dialog" id="link2">Open dialog2</a> 
     </div> 
    </div> 
    <div data-role="page" id="dialog2"> 
     <div data-role="header"> 
      <h1>dialog2</h1> 
     </div> 
     <div data-role="content"> 
     </div> 
    </div> 
</body>

嘗試一下代碼。讓我知道如果這工作或沒有。

來源

2012-09-05 07:50:22

不，不工作。謝謝 –

打開第二個彈出窗口時設置一個很短的時間間隔。

$('#Popup1').dialog('close'); 

setTimeout(function() { 
    $.mobile.changePage('#Popup2', { 
     'role': 'dialog' 
    }); 
}, 1000);

來源

2013-09-20 16:42:28 Mia

這裏的主要問題是「開放」和「關閉」對話框是誤用。你並沒有真正「打開」或「關閉」它們，而是使用瀏覽器歷史記錄「導航到」或「導航離開」 - 要麼將對話框添加到歷史記錄中，要麼將其刪除（「回」）。從第一個對話框導航到另一個對話框時，它會將第二個對話框推送到瀏覽器歷史記錄上，但是會使用密切的動畫爲第一個對話框設置動畫。

一旦你瞭解了這一點，尋找解決方案變得非常簡單，並且有幾個選項可以使用。

禁用changeHash打開的對話框將阻止它們被添加到歷史記錄中，因此您可以打開第二個，並在關閉它時顯式導航回到主頁。
將鏈接更改爲首先「關閉」第一個對話框（jQuery mobile通過歷史記錄返回），然後「打開」第二個對話框（即導航到新頁面）。這就是你現在得到的認爲的效果，因爲jQM像這樣做了動畫，但它在底層做了一些不同的事情。

來源

2013-09-20 17:07:15 xdumaine

jquerymobile關閉對話框後打開另一個

回答

相關問題