如何在jquery中關閉彈出窗口

Question

我在jquery中創建了一個Popup窗口。當郵件圖標點擊它會打開一個包含一個彈出

輸入電子郵件 - 標籤 電子郵件-text箱 發送 - 巴頓 接近 - 按鈕

當另一個圖標稱爲打印圖標點擊它會打開另一個彈出帶確認消息「是否確定要打印」，按是，否。

當點擊打印圖標時，郵件彈出窗口應該自動關閉，反之亦然。

快照是這裏

http://www.flickr.com/photos/41695354@N08/3864786560/

我的代碼是在這裏。

$("#idemail").live('click', function(event) { 
     $(this).addClass("selected").parent().append(); 
     $(".mailpop").slideFadeToggle() 
     $("#idemail").focus(); 
     return false; 
    }); 

    $(".mailclose").live('click', function() { 
     $(".mailpop").slideFadeToggle() 
     $("#idemail").removeClass("selected"); 
     return false; 
    }); 

    $("#idprint").live('click', function(event) { 
     $(this).addClass("selected").parent().append(); 

     $(".printpop").slideFadeToggle() 
     $("#idprint").focus(); 
    return false; 
    }); 

    $(".printclose").live('click', function() { 
     $(".printpop").slideFadeToggle() 
     $("#idprint").removeClass("selected"); 
     return false; 
    }); 

請幫我

Answer 1

是slideFadeToggle標準的jQuery功能？如果沒有，你可以編寫兩個類似的函數 - 一個用於slideFadeOpen和一個用於slideFadeClose並使用它們。或檢查其他彈出窗口的可見狀態並觸發其

$("#idprint").live('click', function(event) { 
    $(this).addClass("selected").parent().append(); 

    $(".printpop").slideFadeToggle(); 

    if ($(".mailpop").is(":visible")) { 
     $(".mailpop").slideFadeToggle(); 
    } 
    $("#idprint").focus(); 
return false; 
}); 

Answer 2

我從來沒有在jQuery的「切換」的粉絲，並會永遠只能考慮用它來隱藏/顯示本身。即使那時我只是使用標準的隱藏和顯示方法。您可能還想關閉電話以切換到分號...

請不要錯過...我將您的切換呼叫更改爲fadeIn/fadeOut，並關閉帶有分號的函數調用。

$("#idemail").live('click', function(event) { 
    $(this).addClass("selected").parent().append(); 
    $(".mailpop").fadeIn("slow"); 
    $("#idemail").focus(); 
    return false; 
}); 

$(".mailclose").live('click', function() { 
    $(".mailpop").fadeOut("slow"); 
    $("#idemail").removeClass("selected"); 
    return false; 
}); 

$("#idprint").live('click', function(event) { 
    $(this).addClass("selected").parent().append(); 

    $(".printpop").fadeIn("slow"); 
    $("#idprint").focus(); 
return false; 
}); 

$(".printclose").live('click', function() { 
    $(".printpop").fadeOut("slow"); 
    $("#idprint").removeClass("selected"); 
    return false; 
});