ASP.Net Post-back打破了jQuery FancyBox

时间:2011-08-09 14:53:13

标签: javascript jquery asp.net fancybox

我在ASP.Net aspx页面上有一个FancyBox帮助链接,注册如下:

    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
    <script type="text/javascript" src="fancybox/jquery.fancybox-1.3.4.js"></script>
    <link rel="stylesheet" type="text/css" href="fancybox/jquery.fancybox-1.3.4.css" media="screen" />

    <script type="text/javascript">
        $(document).ready(function() {

        $("#help").fancybox({
            'width': '90%',
            'height': '90%',
            'autoScale': true,
            'transitionIn': 'elastic',
            'transitionOut': 'none',
            'titleShow': false,
            'type': 'iframe'
        });

    });
  </script>

它工作正常,但在2个帖子后面(仍然在1之后工作)这里抛出一个例子(在fancybox.js中),当我点击帮助链接时,'wrap'不是一个对象:

    $.fancybox.center = function() {
    var view, align;

    if (busy) {
        return; 
    }

    align = arguments[0] === true ? 1 : 0;
    view = _get_viewport();

    if (!align && (wrap.width() > view[0] || wrap.height() > view[1])) {
        return; 
    }

在第三篇文章回来之后,在jquery.js文件Microsoft JScript runtime error: Object doesn't support this property or method中完全加载页面之前会抛出一个错误,指向没有任何位置。

为什么回帖会破坏fancybox?

1 个答案:

答案 0 :(得分:4)

解决方案是添加“lazy_loader”。

这会在每个回发中加载你的fancybox类

<script type="text/javascript">
    $(document).ready(function () {
        Sys.WebForms.PageRequestManager.getInstance().add_endRequest(lazy_loader);
        lazy_loader();
    });

    function lazy_loader() {
        $("#help").fancybox({
            'width': '90%',
            'height': '90%',
            'autoScale': true,
            'transitionIn': 'elastic',
            'transitionOut': 'none',
            'titleShow': false,
            'type': 'iframe'
        });
    }
</script>

这应该可以正常使用