Question

我正在构建网站，其中在用户按下链接之前未加载页面的一个元素。链接是本地形式，非常沉重，大部分时间都不需要（除非用户按下链接，否则我不想加载表单。）

然后将表单加载到div中并使用许多原始页面配置和scrips。

现在，我想直接将表单加载为fancybox（overlay）但是它最不是一个局外人DOM（例如不是iframe）所以它仍然可以访问原始页面的所有必要脚本，功能和设计

有什么建议吗？

Answer 1

您可以使用.load()在现有（隐藏）div中插入表单，然后在fancybox中将其显示为inline内容....类似于：

html

<a class="fancybox" href="external_form.html">display form</a>

<div id="formPlaceHolder" style="display: none"></div>

jQuery

jQuery(document).ready(function ($) {
    $(".fancybox").on("click", function (e) {
        e.preventDefault();
        $('#formPlaceHolder').load("" + this.href + "", function () {
            $.fancybox(this, {
                // fancybox API options here
            }); 
        }); // load
    }); // on click
}); // ready

最终，您可以使用afterClose回调在提交后从DOM中删除form，如：

afterClose: function(){
    $('#formPlaceHolder').empty();
}

如何在不使用iframe的情况下将本地href直接加载到fancybox？

1 个答案: