Question

我正在使用jquery加载类别明智的数据。我想通过lightbox显示这些数据。我在下面给出了我的js代码： -

$(".ajaxLoad").click(function(event)
    {
        str=$(this).attr("href");
        signal="scripts/getPortfolio.php?id="+str;
        $.ajax({url:signal,
            beforeSend: function() {
              $("#indexSpinner").css("visibility","visible");
              },
              complete: function() {
                   $("#indexSpinner").css("visibility","hidden");
              },
            success:function(result){
            $(".hover").html(result);
        }});
         event.preventDefault();
    });

通过这段代码我成功获取数据。但是当我试图将这些数据显示到lightbox中时，它没有在lightbox中显示数据。我在下面给出了完整的jquery代码：

jQuery.noConflict();
(function ($) {
$(document).ready(function()
{
    $("a.group").fancybox({
      'nextEffect'  :   'fade',
      'prevEffect'  :   'fade',
      'overlayOpacity' :  0.8,
      'overlayColor' : '#000000',
      'arrows' : false,
      });           


    $(".ajaxLoad").click(function(event)
    {
        str=$(this).attr("href");
        signal="scripts/getPortfolio.php?id="+str;
        $.ajax({url:signal,
            beforeSend: function() {
              $("#indexSpinner").css("visibility","visible");
              },
              complete: function() {
                   $("#indexSpinner").css("visibility","hidden");
              },
            success:function(result){
            $(".hover").html(result);
        }});
         event.preventDefault();
    });

});
})(jQuery);

如何在lightbox中加载数据。有什么想法吗？

Answer 1

根据文档http://fancyapps.com/fancybox/#docs，默认设置为'live': true true，但您应该添加它;

jQuery(document).ready(function($){ //just put a dollar sign here to avoid jQuery confliction inside this scope;

    var fancySettings = {
        'live'        : true,
        'nextEffect'  : 'fade',
        'prevEffect'  : 'fade',
        'overlayOpacity' : 0.8,
        'overlayColor' : '#000000',
        'arrows' : false //, in the last key-value pair, here should not be any ',' otherwise it will create error, specially in IE and older browsers
    };

    //for initial items:
    $("a.group").fancybox(fancySettings);


    $(".ajaxLoad").click(function(event){
        event.preventDefault();
        str = $(this).attr("href");
        signal="scripts/getPortfolio.php?id="+str;
        $.ajax({
            url:signal,
            beforeSend: function() {
                $("#indexSpinner").css("visibility","visible");
            },
            complete: function() {
                $("#indexSpinner").css("visibility","hidden");
            },
            success:function(result){
                $(".hover").html(result).find("a.group").fancybox(fancySettings); //define with each load for ajaxed items;
            }
        });
        return false;
    });
});

加载数据后如何解决jquery冲突？

1 个答案: