我在 Stackoverflow 上找到了这个脚本：
https://stackoverflow.com/a/7571867/2518302
当将该代码置于正常状态时：
$(document).ready(function () { Script });
.. 脚本运行良好。问题是它不会影响站点上动态加载的内容，因此如果有一个动态加载的 div（在页面加载之后），则脚本在该 div 上不起作用。
然后，如果触发脚本在动态内容加载的同时再次运行，则在页面上使用此脚本加载已经存在的 div ）。这样做的结果是所有得到脚本两次的 div 都以双倍的速度滚动。
有什么方法可以在页面加载时执行脚本并使其影响页面加载后页面上的内容和以后动态加载的内容？
感谢您的宝贵时间。
【问题讨论】：
标签： jquery
使用on jQuery 函数。
$(document).on("event", "selectorOfDynamicElements", function() {
// do something
});
在documentation 我们发现这个：
.on( 事件 [, 选择器] [, 数据], 处理程序(eventObject) )
因此，在示例中，我们将使用以下参数检测对document 的点击：
events：“点击”selector: ".myFavoriteClass"When a selector is provided, the event handler is referred to as delegated.当事件直接发生在绑定元素上时，不会调用处理程序，而只会调用与选择器匹配的后代（内部元素）。
事件处理程序仅绑定到当前选定的元素；当您的代码调用 .on() 时，它们必须存在于页面上。为确保元素存在并且可以被选择，请在页面 HTML 标记中的元素的文档就绪处理程序内执行事件绑定。
[阅读更多documentation page]
this fiddle 中的问题是您创建了对每个 mouseover 的绑定。
$(document).on('mouseover', '.test', function () {
// the mouseover is detected, "Hey, create a new handler!"
$('.test').bind('mousewheel DOMMouseScroll', function(e) {
// "Ok, sir. Here your code goes"
});
});
您应该简单地拥有以下代码，而不是上面的代码：
$(document).on('mouseover mousewheel DOMMouseScroll', '.test', function (e) {
// here your code goes
});
【讨论】：
使用on 并委托给页面加载时存在的元素。
例如，如果页面加载时不存在的动态创建的div 看起来像这样
<div id="dynamic"></div>
您的JS 看起来像这样
$(body).on(event, '#dynamic', function(){ Script });
其中event 等于click、mousedown 等。
【讨论】：