scroll（）在动态元素的jQuery中不工作

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

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

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

---

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

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

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

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

使用

$（document）

作为接收器而不是

$（“.wrapper1”）

的原因是只有在绑定时存在的元素才会接收和委派事件<上的代码>与旧的

live

不一样

但这不适用于

滚动

事件，因为它们不会冒泡

因此，我能提出的最合理的解决方案是定义一个函数：

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

并在开始时调用它：

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

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

myNewElement.bindScrollHandler1();

---

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

我知道您解决了问题（或者您认为您解决了问题），但如果您有一些问题，您应该知道：

事件处理程序仅绑定到当前选定的元素；在代码调用

.on（）

时，它们必须存在于页面上

这是从

有两种方法可以使用

.on（）

函数：

$（'selector'）。on（'event'，function（）{body of the handler}）

事件处理程序直接附加到匹配的元素。因为这是必须完成的，所以选择器被解析，所有匹配的元素都得到一个附加的事件处理程序。这与调用
$（'.asdf'）相同。例如，单击（）

$（'selector1'）。on（'event'，'selector2'，function（）{handler}）

如您所见，有2个选择器：事件处理程序将附加到selector1，但它将处理在selector2上触发的事件！这与
.live（）
或
.delegate（）
非常相似（实际上完全相同）

.live（）
所做的是将事件处理程序附加到“document”，并处理选择器匹配的元素的事件（与
$（“document”）.on（'event'，selector'，function（）{}）；
）

这样做的好处是，事件处理程序附加到一个已经存在的元素，并且可以通过事件冒泡处理动态创建的元素的事件

因此，在您的例子中，第二种语法似乎就是您所需要的

---

编辑：这有一个我不知道的大问题：滚动元素没有冒泡。有变通办法，但我现在没有时间写解决方案。等我过几个小时回来再谈。或者，如果dystroy的解决方案有效，请毫不犹豫地接受它。

在我的应用程序中，我有一个按钮，每次单击按钮时都会将表单字段集附加到正文中-我想将页面向下滚动到新元素，但由于明显的原因（冒泡等），该按钮不起作用。我想出了一个简单的解决办法

function scroll(pixels){
    $('html, body').animate({
        scrollTop: pixels
    }, 1000);
};

function addObservation(x){
    $('body').append(x);
    newFieldSet = $('fieldset').last();
    pixelsFromTop = newFieldSet.offset().top;
    scroll(pixelsFromTop);
};

$(document).on("click", "#add_observation", function(){
    addObservation("<fieldset>SOME FORM FIELDS HERE</fieldset>");
});

功能滚动（像素）{
$（'html，body'）。设置动画({
滚动顶：像素
}, 1000);
};
功能观察（x）{
$（'body'）。追加（x）；
newFieldSet=$（'fieldset'）.last（）；
pixelsFromTop=newFieldSet.offset（）.top；
滚动（像素自顶）；
};
$（文档）。在（“单击”，“添加观察”，函数（）上）{
addObservation（“此处的某些表单字段”）；
});

---

因此，每次添加字段集时，

.offset（）.top

会测量字段集距顶部的像素数，然后滚动窗口显示该距离。在您的情况下，您可以执行

pixelsFromLeft=newFieldSet.offset（）.left

并将

scrollTop

替换为

scrollLeft

，或者类似的操作。

您为什么使用这个过时的版本？我知道我不会管理一个不适合当今浏览器的版本，并且在新版本中修复了很多错误。因为在我的项目中，a已经使用了这个版本。任何版本都没有问题me@PSR建议

live

在

或
委托上使用
。@dystroy我使用1.9.1版本解决了我的问题。感谢uNo:因为滚动事件没有bubble，您不能将其委托给动态添加的元素。这比我想象的要困难一些。试试戴斯特罗伊的解决方案@戴斯特罗伊：你说得对。@SoonDead一开始我和你一样惊讶。可能有更好的解决方案，但我看不到。我用一个不漂亮但我现在看到的最好的解决方案进行了编辑。