的fancybox链接不工作阿贾克斯

问题描述：

$("a.productForm").fancybox({ 
    'hideOnOverlayClick' : true, 
    'modal' : true, 
    'hideOnContentClick' : false, 
    'showCloseButton' : false, 
    'padding' : 0, 
    'transitionIn' : 'elastic', 
    'transitionOut' : 'elastic', 
    'autoScale'  : false, 
    'autoDimensions': false, 
    'frameWidth': 717, 
    'frameHeight': 900, 
    'overlayOpacity': 0.4, 
    'centerOnScroll' : false, 
    'type': 'ajax', 
    'ajax': { 
    dataFilter: function(data) { 
     return $(data).find('#form_wrapper')[0];} 
} 
});

可以在this页它是如何工作看。

要查看我的fancybox形式，按请链接：

enter image description here

正如你可以看到所有的作品只是在这个页面正常，但我的代码在页面，产品加载使用Ajax不会工作。你可以看到this页面。

当你在这个页面按下绿色按钮，fancybox只是不会出现，而是直接进入链接。什么可能是错的？

也许我必须应用fancbox代码到这个链接后，它加载白衣阿贾克斯？

我曾经用jquery 1.4中的livequery插件来解决这个问题。但我认为jQuery 1.7已经有了更好的选择。 – Marnix 2012-03-05 14:07:09

答

在收到html数据并添加到dom后，您需要在ajax成功回调中执行$（“a.productForm”）。fancybox（...）。

这里有一个简单的例子：

$.ajax({ 
    url: "test.html", 
    success: function(data){ 
    $('#newest_desc').html(data); // Here you insert data which I'm expecting to be a string with html into the tab with the id "newest_desc". I got that from your website. Not sure if it's correct though. 
    $("a.productForm").fancybox(...) // Here is where you call the fancybox function because now you know that the element a.productForm is available. 
    } 
});

你能告诉我我该怎么做？ – iKaspars 2012-03-05 14:17:05

@iKaspars我已经添加了一个简单的例子。让我知道它是否有帮助。 – 2012-03-05 15:08:55

谢谢，我会环顾四周。唯一的问题是我没有创建该插件来获得带有Ajax的产品。那样的话，我认为很难找到他们用ajax获得产品的代码部分。不过谢谢。 – iKaspars 2012-03-05 15:13:53

答

你似乎有在JavaScript的一些错误。这会导致链接被浏览器所遵循。

如果您还没有安装Firebug，请启用控制台，然后单击“persist”。这样，当浏览器更改页面时，错误不会消失，您将能够看到错误。

的fancybox链接不工作阿贾克斯

相关推荐