的形式關閉的fancybox的iframe提交使用按鈕標籤 - 不工作

Question

按照API的fancybox，我使用下面的代碼的iframe：

<form> 

... // form fields here 

<button onclick="parent.$.fancybox.close();"> 
<span>Save</span> 
</button> 

</form> 

「保存」被點擊時的形式實際上關閉 - 但表單內容未提交。這就好像在表單實際提交其內容之前觸發了事件close。

沒有onclick，內容被提交，但隨後的頁面在iframe中打開 - 不是我想要的。

有沒有辦法解決這個問題？

感謝您的幫助。

Answer 1

我結束了創建使用多個span（樣式目的）按鈕和jQuery

<span id="save_btn" class="fc-button fc-button-prev fc-state-default fc-corner-left fc-corner-right"> 
     <span class="fc-button-inner"> 
      <span class="fc-button-content save_button">Save</span> 
      <span class="fc-button-effect"> 
       <span></span> 
      </span> 
     </span> 
</span> 

<script> 
$('#save_btn').click(function() { 
    $('#my_form').submit(); 
}); 
</script> 

Answer 2

您可以使用event.preventDefault()方法是這樣的：

<form> 

... // form fields here 

<button onclick="event.preventDefault(); parent.$.fancybox.close();"> 
<span>Save</span> 
</button> 

</form> 

然後submit the page using jquery

因此，這將是更好地使其在這樣的功能：

function closeME() 
{ 
    event.preventDefault(); 
    parent.$.fancybox.close(); 
    $('#myForm').submit(); 
}  
    ... // form fields here 

    <button onclick="closeME();"> 
    <span>Save</span> 
    </button> 



    </form> 

<form action="" method="post" id="myForm"> 
    ... // form fields here 
    <button onclick="closeME();"> 
    <span>Save</span> 
    </button> 
</form> 

    <script type="text/javascript"> 
     function closeME() { 
      event.preventDefault(); 
      parent.$.fancybox.close(); 
      $('#myForm').submit(); 
     } 
    </script> 

Answer 3

幾行這樣一個完美的作品我解決這個：

$('body',top.document).removeClass('fancybox-lock'); 
$('.fancybox-overlay',top.document).css('display','none'); 

所有其他的東西沒有用。

Answer 4

對於其他閱讀器仍然無法讓fancybox從iframe關閉的問題，這可能是iframe與父窗口來自不同來源的問題。那是我遇到的問題。 Rob W提供了一個很好的解決方案，使用postMessage Uncaught TypeError: Cannot read property 'fancybox' of undefined - Google Chrome only error?