例如，在使用AJAX之后，我将有一个可滚动的DIV。如何将滚动事件绑定到它？绑定滚动事件到动态DIV？
我已经试过：
$(window).on("scroll", ".mydiv", function(){...})
$(document).on("scroll", ".mydiv", function(){...})
$(".mydiv").on("scroll", function(){...})
$(".mydiv").scroll(function(){...})
但他们没有工作。
元素必须在文件存在使用jquey.on前（）。
可以插入虚拟<div class="mydiv"></div>您使用jquery.on（）
$('body').append('<div class="mydiv" style="display:none"></div>');
$(document).on("scroll", ".mydiv", function(){...})
你确定吗？我不同意这一点。当使用$（document）.on（event，selector，function（）{...}）选择器不需要存在。文档将在出现时绑定它。你打破了功能。作为你的例子，为什么我们不使用：$（“。mydiv”）.roll（function（）{...}）？ – InOrderToLive 2013-05-12 09:18:41
试试这个从您的代码修改
$(document).ready(function(){
// Trigger
$("#btn").click(function(){
if ($(".myDiv").length == 0) // Append once
$("body").append('<div class="myDiv"><br><br><p>Content1<p><br><br><p>Content2<p><br><br></div>');
});
// Not working
$(".myDiv").scroll(function(){
alert("A");
});
// Not working
$(document).on("scroll", ".myDiv", function(){
alert("A");
});
});
希望这有助于之前
我不确定你为什么把第一次尝试标记为“不工作”，但我已经更新了你的小提琴，它似乎工作：[更新的小提琴]（http://jsfiddle.net/rkLta3jg/1/），我在撰写本文时，已经在Safari，Chrome和Firefox的最新版本中对此进行了测试。 – olger 2015-09-18 08:35:15
http://jsfiddle.net/hainawa/cruut/
$(document).ready(function(){
var $mydiv = $('<div class="myDiv"><br><br><p>Content1<p><br><br><p>Content2<p><br><br></div>');
// It will work
$mydiv.scroll(function(){
alert("A");
});
// Trigger
$("#btn").click(function(){
//You are using the method append,so you don't need judge if div.mydiv exits.
//You'll need do this if you're using display:none
$("body").append($mydiv);
});
});
应指定具有溢出您的DIV的高度等于自动：
.myDiv{
height: 90px;
overflow: auto;
}
我有同样的问题，我已经找到了jQuery .on() API如下：
在所有浏览器中，加载，滚动和错误事件（例如，元素上）不会冒泡。在Internet Explorer 8及更低版本中，粘贴和重置事件不会冒泡。此类事件不支持与委派一起使用，但可以在事件处理程序直接附加到生成事件的元素时使用它们。
因此不幸的是，这似乎不可能。
我只是振兴这个老问题，因为我没有找到好的答案，我挣扎着自己寻找更好的方式来倾听动态附加元素的“滚动”事件。
由于Scroll事件不会在DOM中冒泡，因此我们不能像on（）那样使用滚动。所以我想出了听我自己的自定义触发事件在我想要听'滚动'事件的元素。
将元素附加在DOM上后，触发自己的自定义事件后，滚动事件绑定。
$("body").on("custom-scroll", ".myDiv", function(){
console.log("Scrolled :P");
})
$("#btn").on("click", function(){
$("body").append('<div class="myDiv"><br><br><p>Content1<p><br><br><p>Content2<p><br><br></div>');
listenForScrollEvent($(".myDiv"));
});
function listenForScrollEvent(el){
el.on("scroll", function(){
el.trigger("custom-scroll");
})
}body{ font-family: tahoma; font-size: 12px; }
\t
\t .myDiv{
\t \t height: 90px;
\t \t width: 300px;
\t \t border: 1px solid;
\t \t background-color: lavender;
\t \t overflow: auto;
\t }<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<input type="button" id="btn" value="Click"/>谢谢，这应该标注为解决方案 – vipin8169 2016-01-29 04:27:32
这是解决方案，非常感谢。 – 2017-09-25 21:32:24
它是通过直接连接on工作，检查例如波纹管。
希望这会有所帮助。
$("body").append('<div class="myDiv"><br><br><p>Content1<p><br><br><p>Content2<p><br><br></div>');
$(".myDiv").on("scroll", function(){
\t console.log("scrolling");
}); \t\t body{ font-family: tahoma; font-size: 12px; }
\t
\t .myDiv{
\t \t height: 90px;
\t \t width: 300px;
\t \t border: 1px solid;
\t \t background-color: lavender;
\t \t overflow: auto;
\t }<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>在我的应用程序，我有一个按钮，每一个按钮被点击时附加形式的fieldsets的身体 - 我想滚动页面到新的元素，但没没有明显的原因（冒泡等）。我想出了一个简单的解决...
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>");
});
所以每次添加一个字段时，发现jQuery的最后一个。接着，添加.offset().top措施的字段集多少像素从顶部，然后滚动窗口距离。
你能举个实际的例子吗？ – user568109 2013-05-12 07:49:46
您在这里： http://luanxt.tk/Demo/testing.htm – InOrderToLive 2013-05-12 09:06:14
您在代码中完全没有使用ajax。 – moonwave99 2013-05-13 10:14:56