0

我想加载fancybox以在div中显示查询信息。在 Firebug 中，我可以看到一切顺利，但幻想框窗口没有像我预期的那样弹出。我错过了什么让它可以弹出？

<td><a class="pop" href="#gps_information" id="<?php echo $gps->labref ?>"><?php echo $gps->labref ?></a><input type="hidden" id="labref" value=""/></td> 


<div id="gps_information">    
    </div> 

$(document).ready(function () {
    $('.pop').click(function () {
        labref = $(this).attr('id');
        $.ajax({
            type: "GET",
            url: "<?php echo base_url(); ?>sample_location/gps/" + labref,
            dataType: "json",
            success: function (data) {
                var data = "I am waiting";
                $('#gps_information').html(data);

                $('.pop').fancybox({});

                return true;
            },
            error: function (data) {
                return false;
            }
        });
        return false;
    });
});
4

1 回答 1

0

一些考虑，

1）。这个

$('.pop').fancybox({});

...实际上并没有触发fancybox，它只是将fancybox绑定到选择器.pop

2）。如果 ajax 成功，您最终将有两个事件处理程序应用于同一个选择器

$('.pop').click({});
$('.pop').fancybox({});

...因为第一个返回false，第二个永远不会生效。

3）。如果填充 div ( ) 背后的想法<div id="gps_information">只是在fancybox 中显示它，那么您可能根本不需要它。您可以直接在 fancybox 中显示返回的 ajaxdata而无需填充div.

话虽如此，您可以通过以下方式调整代码：

$jQuery(document).ready(function () {
    $('.pop').click(function () {
        labref = $(this).attr('id');
        $.ajax({
            type: "GET",
            url: "<?php echo base_url(); ?>sample_location/gps/" + labref,
            dataType: "json",
            success: function (data) {
                //var data = "I am waiting"; // it would override returned data, wouldn't it?
                //$('#gps_information').html(data);
                $.fancybox(data, {
                    // API options here
                });
                // return true; // need no more
            },
            error: function (data) { // (data) what for?
                return false;
            }
        });
        return false;
    });
});
于 2013-06-13T21:43:31.010 回答