加载动态的AJAX的内容转换成的fancybox转换成、加载、动态、内容

2023-09-10 13:32:48 作者:酒醉人心碎

这样的场景:

该用户将自己的邮政编码为输入字段,然后点击魔法按钮时,他会看到商店最接近他的位置。我所说的服务完美的罚款,并与一些AJAX善良装载入。一切都很好。

The user inserts his zip into an input-field, and when clicking the magic button, he gets to see stores closest to his location. I call the service perfectly fine, and load it in with some AJAX-goodness. All is well.

现在,而是在某个页面上插入的结果,我希望它显示在的fancybox。我根本无法进行这项工作。

Now, Instead of inserting the results somewhere on the page, I want it displayed in a Fancybox. I simply can't make this work.

JavaScript的:

$('#button').on('click', function(){    
   // Function to build the URL edited out for simplicity       
   var nzData = '/url.com?Zip=8000 #module';

   $.fancybox({
      ajax: { 
         data: nzData
        }
    });
});

我期待的fancybox弹出,并告诉我从URL标记( nzData )。的fancybox加载,但不是内容,我得到一个字符串说的的请求的内容无法加载。请稍后再试。的。

I expect Fancybox to popup and show me the markup from the URL (nzData). Fancybox loads, but instead of content, I get a string saying "The requested content cannot be loaded. Please try again later.".

这不是与服务的问题,所以我怀疑这只是我忽视的东西或强奸的fancybox API。那么,我究竟做错了什么?

It's not a problem with the service, so I suspect it's just me overlooking something or raping the Fancybox API. So, what am I doing wrong?

编辑:我忘了提,我使用的是旧版本的fancybox(V1.3.4)。

I forgot to mention, I am using the old version of Fancybox (v1.3.4).

推荐答案

我结束了加载内容到一个隐藏的容器在页面上,然后显示在的fancybox的内容。

I ended up loading the content into a hidden container on the page, and then displaying that content in a Fancybox.

$('#button').on('click', function(){    
   var nzData = '/url.com?Zip=8000 #module';

     $('#foo').load(nzData, function(){
       var foo = $('#foo').html(); 
       $.fancybox(foo);
    });

});

这不是很pretty的,我承认这一点,但它是我可以使它工作的唯一途径。我今天早上,谁曾使出了类似的问题相同的解决方案跟其他开发人员。

It's not very pretty, I admit it, but it's the only way I could make it work. I talked to another developer this morning, who had resorted to the same solution in a similar problem.

不过,必须有一个更好的解决方案。如果任何人都知道,我很乐意听到它!

Still, there must be a better solution. If anyone know, I'd love to hear it!