0

我正在使用 Drupal 7 并通过页面上的 View 模块获取我的内容。而我的寻呼机视图加载更多模块。还有我的缩略图效果悬停，阴影等。使用此代码的图像悬停：

var hoverImg = '<div class="hoverimg"></div>';

$(".thumb").each(function(){
    $(this).children("div").each(function(){
        $(this).find("a").append(hoverImg);
    });
});

$(".thumb div").hover(function() {
    $(this).find(".hoverimg").animate({ opacity: 'toggle' });
});

$(".thumb").hover(function() {
    $(this).find("div").each(function(){
        $(this).find(".shadow").fadeOut(500);
    });
});

并在我当前的缩略图上获取数字。这段代码：

var c = '';
var d = '';
$('.view-content div.views-row').each(function(){
    c = 0;
    d = 0;
    var i = 1;
    d = $(this).find('.thumbimg').length;
    $(this).find('.thumbimg').each(function(){
        sayi=i++;
        $(this).append('<div class="img_no">0'+sayi+'</div>');
    });
});

一切都好。起始页上的所有效果。但是当点击加载更多按钮时，我的效果不能在另一个页面上工作。

我该如何解决这个问题？谢谢。

4

1 回答 1

1

它停止工作的原因是悬停功能（以及您的其他脚本/功能）仅适用于现有元素。因此，如果您使用 ajax 添加某些内容，除非您在 ajax 加载后重新加载脚本，否则它不会适用。

另一种选择是使用 live() 或 on() （用于悬停部分。On 是新版本的 live，在 jQuery 1.7 中添加）。Live and on 聆听任何现有或未来的元素。

实时脚本看起来像这样：

            $(".yourElement").live({
                mouseenter:
                function () {
                    // Do something
                },
                mouseleave:
                function () {
                    // Do something
                },
                mousemove:
                function () {
                   // Do something
                }
            });
于 2012-04-06T11:46:08.663 回答