jquery - 对于动态元素，scroll() 在 jQuery 中不起作用

Question

我正在使用以下内容。这不适用于动态创建的元素。我正在使用 jQuery 1.4.2

 $(".wrapper1").live("scroll",function(){
     alert(123);
    $(".wrapper2")
    .scrollLeft($(".wrapper1").scrollLeft());
  });

这也不适用于普通元素。(在页面加载时加载)

这可能是什么原因。请帮助我。提前致谢......

Answer 1

浏览器发生变化，jQuery bug 已修复，这就是为什么始终使用最新版本的 jQuery 很重要的两个原因(经过适当的测试，您不能只指向最新版本)。

您的代码适用于 jQuery 1.9，对于另一种事件类型，

$(document).on("event_type",".wrapper1", function(){
    $(".wrapper2")
        .scrollLeft($(".wrapper1").scrollLeft());
});

使用 $(document) 作为接收者而不是 $(".wrapper1") 的原因是，只有在绑定(bind)时存在的元素才会接收并委托(delegate)事件。 on 不像旧的 live 那样工作。

只不过这不适用于 scroll 事件，因为它们不会冒泡。

所以我能提出的最合理的解决方案是定义一个函数:

$.fn.bindScrollHandler1 = function(){
    $(this).on('scroll', function(){
       $(".wrapper2").scrollLeft($(".wrapper1").scrollLeft());
    });
}

并在开始时调用它:

$('.wrapper1').bindScrollHandler1();

每次创建新的 .wrapper1 元素时:

myNewElement.bindScrollHandler1();

Demonstration

请注意，您的完整逻辑似乎有点缺乏，因为您没有配对滚动条，而是使它们全部工作相同。