使用load()加载外部文件,然后使用fancybox插件进行修改并显示

Loading exteral file with load(), modifying and then displaying with fancybox plugin

本文关键字:插件 fancybox 显示 修改 然后 load 加载 外部 文件 使用      更新时间:2024-04-26

我试图在点击按钮后加载一个外部文件,修改外部文件的一些html,然后通过fancybox插件显示它。我已经试了好几天了,但没有成功。

按钮

<a id="preview" class="btn btn-lg btn-success">Preview</a>

然后用一些代码将外部html文件加载到一个显示关闭的元素中(我知道这是错误的,我不知道其他方法)。然后,我尝试用fancybox打开这个元素。

$('#preview').click(function() {
  $('#loader').load("demo/external.html", function(page) {
     $.fancybox.open({ content: $('loader'), type: iframe});
  })
});

正如你所知,我在这方面是个业余爱好者。如有任何帮助,我们将不胜感激。

随着更多的研究,我发现一切都可以通过Fancybox API完成。我使用beforeShow在外部页面上修改我想要的内容。CCD_ 1用于访问内容。

$.fancybox({
    'href': 'demo/external.html',
    'type': 'iframe',
    'autoSize': true,
    beforeShow: function () {
      $('.fancybox-iframe').contents().find('#name').text(name);
    }
  });