触发 PrettyPhoto 后重新加载 jQuery 函数

Question

我希望标题是不言自明的。无论哪种方式，我正在尝试在另一个进程被触发后重新加载（或重新读取）jQuery 中的一个函数（在本例中为 prettyPhoto 插件）。

这是我当前的 jQuery 函数：

        /** Scrolling Sidebar function **/
            var $sidebar   = $(".sideBar"),
                $window    = $(window),
                $mainImage = $(".mainImage"),
                offset     = $sidebar.offset(),
                threshold  = $mainImage.height() - $sidebar.height(),
                topPadding = 15;

    <?php if ( $options['scroll_sidebar'] == true ) { ?>
        if( $mainImage.height() >= 400 ) {
            $window.scroll(function() {
                if ($window.scrollTop() > threshold) {
                    if( $('.sideBar').has('.zoomImage').length ) {
                        $sidebar.stop().animate({
                            marginTop: threshold + 50
                        });
                    } else {
                        $sidebar.stop().animate({
                            marginTop: threshold + 60
                        });
                    }
                } else if ($window.scrollTop() > offset.top) {
                    $sidebar.stop().animate({
                        marginTop: $window.scrollTop() - offset.top + topPadding
                    });
                } else {
                    $sidebar.stop().animate({
                        marginTop: '40px'
                    });
                }
            });
        }
    <?php } ?>

当一个带有 fullSize 类的锚标签被点击时，prettyPhoto 会被触发。

我跟随this 线程使用 setTimeout 方法重新加载“代码块”。这就是我所做的：（将前面的代码包装在一个函数中，在该函数内部使用 setTimeout，然后在函数外部调用 setTimeout）

    /** Scrolling Sidebar function **/
function scrollSidebar() {
            var $sidebar   = $(".sideBar"),
                $window    = $(window),
                $mainImage = $(".mainImage"),
                offset     = $sidebar.offset(),
                threshold  = $mainImage.height() - $sidebar.height(),
                topPadding = 15;

    <?php if ( $options['scroll_sidebar'] == true ) { ?>
        if( $mainImage.height() >= 400 ) {
            $window.scroll(function() {
                if ($window.scrollTop() > threshold) {
                    if( $('.sideBar').has('.zoomImage').length ) {
                        $sidebar.stop().animate({
                            marginTop: threshold + 50
                        });
                    } else {
                        $sidebar.stop().animate({
                            marginTop: threshold + 60
                        });
                    }
                } else if ($window.scrollTop() > offset.top) {
                    $sidebar.stop().animate({
                        marginTop: $window.scrollTop() - offset.top + topPadding
                    });
                } else {
                    $sidebar.stop().animate({
                        marginTop: '40px'
                    });
                }
            });
        }

        $('a.fullSize').click(function() {
            setTimeout(scrollSidebar, 1000);
        });
<?php } ?>

    }
setTimeout(scrollSidebar, 1000);

很遗憾，这不起作用。那么，一旦触发了另一个动作/插件，您对如何重新加载/重新读取函数有什么想法吗？

谢谢！
克里斯

Answer 1

" 在另一个进程被触发后，我正在尝试在 jQuery 中重新加载（或重新读取）一个函数"

为什么要调用 setTimeout？这将在一定时间后触发函数调用，然后每 1000 毫秒循环/重复一次。如果你只是想重新加载函数，只需调用函数本身。

 $('a.fullSize').click(function() {
            scrollSidebar();
        });

编辑： 你漂亮的图像可能会影响滚动条。但是，http://www.no-margin-for-errors.com/projects/prettyphoto-jquery-lightbox-clone/documentation/ 具有回调属性。所以我喜欢这样（回调函数将在关闭 perryimaege 时被调用，因为你遇到的问题是当它漂亮的图像打开时。所以在这方面，这就是为什么点击事件没有解决你的问题（代码可能正在工作））图片关闭后你需要一些东西

$("a[rel^='prettyPhoto']").prettyPhoto({
        allow_resize: true,
        theme: 'facebook', /* light_rounded / dark_rounded / light_square / dark_square / facebook */
        callback: sideBar
    });

并在其他地方声明您的侧边栏

function sideBar()
{
    var $sidebar   = $(".sideBar"),
    $window    = $(window),
    $mainImage = $(".mainImage"),
    offset     = $sidebar.offset(),
    threshold  = $mainImage.height() - $sidebar.height(),
    topPadding = 15;

    if( $mainImage.height() >= 400 ) {
        $window.scroll(function() {
            if ($window.scrollTop() > threshold) {
                if( $('.sideBar').has('.zoomImage').length ) {
                    $sidebar.stop().animate({
                        marginTop: threshold + 50
                    });
                } else {
                    $sidebar.stop().animate({
                        marginTop: threshold + 60
                    });
                }
            } else if ($window.scrollTop() > offset.top) {
                $sidebar.stop().animate({
                    marginTop: $window.scrollTop() - offset.top + topPadding
                });
            } else {
                $sidebar.stop().animate({
                    marginTop: '40px'
                });
            }
        });
    }   
}

来自您网站http://jsfiddle.net/qeDwM/的工作代码