2010-12-08 83 views
5

父鏈接:如何從子窗口關閉fancybox?

<a href="feedback.php" id="feed">Provide your feedback here</a> 

jQuery代碼發起的fancybox是...

$("#feed").fancybox(); 

在feedback.php代碼...

 <html> 
     <head> 
<script language="javascript">  
$(document).ready(function(){ 
    $("#feed_submit").click(function(){ 
    //Name is alerted 
    alert($("#name").val()); 

    //code to close fancy box(Not working) 
    $.fancybox.close(); 

    }); 
    }); 
</script> 
     </head> 
     <body> 
     <form method="post" name="feedback" id="feedback" action=""> 
       <div> 
        <label>name</label> 
        <input type="text" name="name" id="name"/> 
       </div> 
       <div> 
        <label>feedback</label> 
        <input type="text" name="content" id="content"/> 
       </div> 
     <div><input type="button" name="feed_submit" id="submit" value="submit"></div> 
    </form>  
    </body> 
    </html> 

一旦點擊提交按鈕我需要關閉花式框本身jquery

我一直在使用

$.fancybox.close(); 
parent.$.fancybox.close(); 

試圖但是,這並不爲我工作。如果有任何選擇關閉這個Ajax表格請讓我知道。

+0

你能告訴我們你的其他代碼嗎? – karim79 2010-12-08 17:49:37

+0

@ karim79我認爲這就是所有相關的代碼。 – 2010-12-08 19:19:40

+0

適合我$ .fancybox.close(); thnx,我正在尋找這個:D – holms 2011-09-06 13:34:23

回答

10

下面的代碼應該工作,並已爲許多人

parent.$.fn.fancybox.close(); 

但是,我也看到了工作,例如in this question,jQuery的在noConflict模式下運行,用戶不知道的。如果這是你的話,你必須修改你的腳本

parent.jQuery.fn.fancybox.close(); 

如果沒有這些工作,請使用Firefox的螢火蟲一樣的工具,或爲Chrome開發者控制檯,看是否有是一條錯誤消息,並向我們報告它是什麼。

7

嘗試

window.parent.$.fancybox.close(); 

假設父窗口$.fancybox.close();作品。

+0

fancybox打開一個DIV元素,而不是一個實際的彈出窗口,所以不會有`window.opener`。 – 2010-12-13 07:31:02

+1

@David當你自己在你的回答中使用`window.parent`時,你怎麼能發表這個評論?你做了這樣的事情,仍然認爲fancybox在這種情況下打開一個div而不是另一個窗口(iframe)? – 2010-12-13 07:45:39

+1

它使用iframe打開div。一個iframe沒有`window.opener`。 – 2010-12-13 07:50:51

0
$.fn.fancybox.close(); 

能完成這項工作?

-1

parent.jQuery.fancybox.close(); 與。$。 - 在IE8中壓縮。有了這個 - 一切就OK了。

1

當你使用的是與類型的fancybox:。iframe中,你必須插入所有的庫如jQuery等iframe中框,然後關閉iframe的花式盒只需使用父$ fancybox.close()

記住類型爲「iframe」的fancybox會在新窗口中打開,其他類型的fancybox會在同一個窗口中打開。

2

嘗試:

$("#fancybox-close").trigger('click'); 
1

面臨着同樣的問題,這是我該訣竅找到了唯一的解決辦法:

代碼本身是:

parent.jQuery.fancybox.close(); 

它運行在功能如下:

jQuery("#cancelId").click(function(){ 
    parent.jQuery.fancybox.close(); 
}); 

希望有幫助, 鬧熱

0

//在子窗口或iframe把這個功能:

function closeIframe(){ parent.closeIframeMain(); }

//而這個鏈接關閉此窗口

<a onclick="closeIframe();" href="#">Close window</a>

//然後在父窗口放上這個功能:

function closeIframeMain(){ jQuery("#fancybox-close").trigger("click"); }

0

這將是肯定的工作,只是複製並粘貼:

<a href="javascript:;" onclick="jQuery('.fancybox-close').fancybox().trigger('click');">Close from Inside</a>

其實,如果自身的fancybox,這在大多數情況下,工作的觸發關閉按鈕。

玩編程:)

0

我有同樣的問題,但與ASP.NET。

基本上,一個頁面上,我打開一個頁面(與表單控件中)是這樣的:

$.fancybox({ 
       href: '/ContactUs.aspx', 
       type: 'iframe', 
       padding: 60, 
       width: 465, 
       height: 670, 
       maxWidth: 465, 
       maxHeight: 670, 
      }); 

當我點擊關閉的的fancybox,它的工作原理,但如果我第一次提交那麼關閉它,fancyBox將不會關閉,即使你的網頁在同一個域中。

最後,我發現你必須設置的autoSize:當您打開的fancybox假:

$.fancybox({ 
       href: '/ContactUs.aspx', 
       type: 'iframe', 
       padding: 60, 
       width: 465, 
       height: 670, 
       maxWidth: 465, 
       maxHeight: 670, 
       autoSize: false 
      }); 

現在應該工作。如果這適用於其他人,請回復。乾杯。