使用BUTTON标签关闭表单上的Fancybox iframe - 无法正常工作

Question

根据Fancybox API,我在iframe中使用以下代码:

<form>

... // form fields here

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

</form>

单击"保存"时表单实际关闭 - 但表单内容未提交.就像在close表单实际提交其内容之前触发事件一样.

如果没有onclick,则会提交内容,但后续页面会在iframe中打开 - 而不是我想要的内容.

有没有解决的办法？

谢谢你的帮助.

Answer 1

您可以像这样使用event.preventDefault()方法:

<form>

... // form fields here

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

</form>

然后使用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>