2010-11-19 72 views
1

我知道這個問題已被要求several timesseveral different forms,但我無法讓它在我的生活中正常工作。Simplemodal for jQuery:關閉當前可見的模態並顯示另一個

我在我的頁面上有兩個DIV用於模態,ids註冊 - 彈出和登錄彈出。他們每個人都有自己的關閉按鈕與類simplemodal關閉和顯示/關閉每個人在自己的工作很好。

我想添加一個按鈕到註冊模式,關閉它並打開登錄模式。我跟着埃裏克給上述第一個環節中的說明,我已經包含如下:

$('a#ask').click(function(){ 
    $('#modal-contact').modal({onShow: function (dialog) { 
     // handle the close yourself. 
     // Don't use the closeClass on this element 
     // call $.modal.close(); when you are done 
     // call a function to open a new modal 
    }); 
    return false; 
}); 

然而,這不起作用;註冊模式關閉,但登錄模式不會。這裏是我的代碼(使用noConflict,因此使用jQuery的()而不是$()):

jQuery(function (jQuery) { 
    jQuery('#btn-signup-open').click(function() { 
     jQuery('#signup-popup').modal({onShow: function (dialog) { 
      jQuery('#login-from-signup').click(function() { 
       jQuery.modal.close(); 
       jQuery('#login-popup').modal(); 
      }) 
     }}); 
     return false; 
    }); 
}); 

而且我也試過,而不是下面,認定它是更簡單,更直接,但得到的結果是同(註冊模式關閉,登錄模式並不密切,常閉按鈕&形式提交優秀作品):

jQuery(function (jQuery) { 
    jQuery('#login-from-signup').click(function() { 
     jQuery.modal.close(); 
     jQuery('#login-popup').modal(); 
     return false; 
    }); 
}); 

我曾嘗試埃裏克的其他建議,這是隻需更換模式的內容。這工作,但似乎hack-y,因爲我必須手動綁定關閉按鈕(不是一個大問題),並且模式不會自動調整較小的登錄窗體的大小。雖然這可行,但似乎應該有更好的方法來做到這一點(特別是我上面的代碼,或者對它進行一些小調整)。

jQuery(function (jQuery) { 
    jQuery('#login-from-signup').click(function() { 
     jQuery('.simplemodal-wrap').html('<div class="popup simplemodal-data" id="login-popup" style="display: block;">'+jQuery("#login-popup").html()+'</div>'); 
     jQuery('.simplemodal-close').click(function() {jQuery.modal.close(); return false;}); 
      return false; 
    }); 
}); 

回答

3

感謝安德烈在另一篇文章中回答了這個問題!

當前onClose事件的作用類似於onBeforeClose,並且沒有爲$ .modal.close()設置onAfterClose。唯一的解決方法就是等待:

$.modal.close(); window.setTimeout(showSecondModal, 500); 

這是我的工作代碼:

jQuery(function (jQuery) { 
    jQuery('#login-from-signup').click(function() { 
    jQuery.modal.close(); 
    window.setTimeout(function() {jQuery('#login-popup').modal()}, 250); 
    return false; 
    }); 
}); 
2

這絕對是解決它的一種方式,但它意味着你的代碼現在異步過。我認爲這很遺憾,因爲一旦你開始異步,你就不能回到同步,並且任何使用你的函數的代碼也必須使用setTimeout()。它可能並不總是很重要,但我認爲它使代碼庫很難進行單元測試。

這種行爲實際上是對於simplemodal版本1.4.1新增的。如果切換回1.3.5關閉和打開可以順序完成,沒有任何問題。

我提出了一個問題over here,看看我們是否能找到一種方法回到擁有同步close()

+0

感謝您提交問題。我會盡快研究它。 – 2010-12-07 18:39:52

+0

會很喜歡修復。我最終也使用了這個setTimeout解決方法,雖然這顯然是一個非常黑客的情況。我認爲結果是因爲1.4.1在內部使用setTimeout來關閉對話框,所以沒有辦法繞過它。 – chug2k 2012-06-01 22:09:50

相關問題