我有2个段落，我用CSS设置了样式，使其具有垂直滚动条。
当我在一个段落框上上下移动时，我希望wheel事件也发生在另一段落框上。
我已经做了大量研究，并且阅读了很多有关滚轮和滚动事件的问题。
这是我的代码：
document.onload = function() {
document.getElementById("p1").addEventListener("wheel", function(e) {
var n = new Event("wheel");
n.deltaY = e.deltaY;
p2.dispatchEvent(n);
});
}p {
width: 200px;
height: 200px;
overflow: auto;
}<p id="p1">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et
dolore magna aliqua. Placerat vestibulum lectus mauris ultrices eros in cursus turpis massa. Libero id faucibus
nisl tincidunt eget nullam non. Donec et odio pellentesque diam. Consequat ac felis donec et odio pellentesque.
Pellentesque id nibh tortor id aliquet lectus proin. Dolor sed viverra ipsum nunc aliquet bibendum enim
facilisis. Sed vulputate odio ut enim blandit. Erat nam at lectus urna duis convallis convallis. Ipsum dolor sit
amet consectetur adipiscing elit. Mattis molestie a iaculis at erat. Risus sed vulputate odio ut. Neque egestas
congue quisque egestas diam in arcu cursus euismod. Blandit massa enim nec dui. Orci nulla pellentesque
dignissim enim sit.
Aliquam purus sit amet luctus. Mauris in aliquam sem fringilla ut morbi tincidunt augue. Vehicula ipsum a arcu
cursus vitae congue mauris rhoncus. Amet dictum sit amet justo. Semper auctor neque vitae tempus quam
pellentesque nec nam aliquam. Viverra nam libero justo laoreet sit amet. Porta lorem mollis aliquam ut
porttitor. Cursus metus aliquam eleifend mi in nulla. Lorem ipsum dolor sit amet consectetur adipiscing elit
pellentesque. Malesuada fames ac turpis egestas. Pellentesque habitant morbi tristique senectus et. Faucibus et
molestie ac feugiat sed lectus. Eget nunc lobortis mattis aliquam. Laoreet id donec ultrices tincidunt arcu non
sodales neque.</p>
<p id="p2">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et
dolore magna aliqua. Placerat vestibulum lectus mauris ultrices eros in cursus turpis massa. Libero id faucibus
nisl tincidunt eget nullam non. Donec et odio pellentesque diam. Consequat ac felis donec et odio pellentesque.
Pellentesque id nibh tortor id aliquet lectus proin. Dolor sed viverra ipsum nunc aliquet bibendum enim
facilisis. Sed vulputate odio ut enim blandit. Erat nam at lectus urna duis convallis convallis. Ipsum dolor sit
amet consectetur adipiscing elit. Mattis molestie a iaculis at erat. Risus sed vulputate odio ut. Neque egestas
congue quisque egestas diam in arcu cursus euismod. Blandit massa enim nec dui. Orci nulla pellentesque
dignissim enim sit.
Aliquam purus sit amet luctus. Mauris in aliquam sem fringilla ut morbi tincidunt augue. Vehicula ipsum a arcu
cursus vitae congue mauris rhoncus. Amet dictum sit amet justo. Semper auctor neque vitae tempus quam
pellentesque nec nam aliquam. Viverra nam libero justo laoreet sit amet. Porta lorem mollis aliquam ut
porttitor. Cursus metus aliquam eleifend mi in nulla. Lorem ipsum dolor sit amet consectetur adipiscing elit
pellentesque. Malesuada fames ac turpis egestas. Pellentesque habitant morbi tristique senectus et. Faucibus et
molestie ac feugiat sed lectus. Eget nunc lobortis mattis aliquam. Laoreet id donec ultrices tincidunt arcu non
sodales neque.</p>
该事件没有调度，什么也没发生。
答案 0 :(得分：1)
手动调度事件可以触发关联的事件侦听器，但是我不认为在这种情况下可以将它们用于触发实际的内容滚动。
由于发生内容滚动而调度了滚动事件。滚动事件不会导致内容滚动，而是由滚动导致的。
一种更简单的方法是仅手动测量和设置相关元素的scrollTop值：
<script>
document.onload = function(){
var p1 = document.getElementById("p1");
var p2 = document.getElementById("p2");
p1.addEventListener("scroll", function(e){
p2.scrollTop = p1.scrollTop;
});
}
</script>
请注意，您还应该使用scroll事件，而不是wheel，因为除了鼠标滚轮以外，还有其他滚动内容框的方法，例如，使用键盘。
var p1 = document.getElementById("p1");
var p2 = document.getElementById("p2");
p1.addEventListener("scroll", function(e){
p2.scrollTop = p1.scrollTop;
});
div {
display: flex;
flex-grow: 1;
border: 1px solid black;
}
p {
max-height: 100px;
overflow: scroll;
}<div><div><p id="p1">
Nulla sit amet est. Phasellus leo dolor, tempus non, auctor et, hendrerit quis, nisi. Vestibulum facilisis, purus nec pulvinar iaculis, ligula mi congue nunc, vitae euismod ligula urna in dolor. Nunc sed turpis. Vivamus laoreet.
Sed in libero ut nibh placerat accumsan. Curabitur ligula sapien, tincidunt non, euismod vitae, posuere imperdiet, leo. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Nullam quis ante. Cras risus ipsum, faucibus ut, ullamcorper id, varius ac, leo.
Praesent blandit laoreet nibh. Proin pretium, leo ac pellentesque mollis, felis nunc ultrices eros, sed gravida augue augue mollis justo. Aenean imperdiet. Nulla porta dolor. Vestibulum ullamcorper mauris at ligula.
Nullam accumsan lorem in dui. Etiam sit amet orci eget eros faucibus tincidunt. Nulla consequat massa quis enim. In hac habitasse platea dictumst. Vivamus laoreet.
Donec id justo. Donec interdum, metus et hendrerit aliquet, dolor diam sagittis ligula, eget egestas libero turpis vel mi. Donec mollis hendrerit risus. Fusce ac felis sit amet ligula pharetra condimentum. Vivamus consectetuer hendrerit lacus.
</p></div><div><p id="p2">
Nulla sit amet est. Phasellus leo dolor, tempus non, auctor et, hendrerit quis, nisi. Vestibulum facilisis, purus nec pulvinar iaculis, ligula mi congue nunc, vitae euismod ligula urna in dolor. Nunc sed turpis. Vivamus laoreet.
Sed in libero ut nibh placerat accumsan. Curabitur ligula sapien, tincidunt non, euismod vitae, posuere imperdiet, leo. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Nullam quis ante. Cras risus ipsum, faucibus ut, ullamcorper id, varius ac, leo.
Praesent blandit laoreet nibh. Proin pretium, leo ac pellentesque mollis, felis nunc ultrices eros, sed gravida augue augue mollis justo. Aenean imperdiet. Nulla porta dolor. Vestibulum ullamcorper mauris at ligula.
Nullam accumsan lorem in dui. Etiam sit amet orci eget eros faucibus tincidunt. Nulla consequat massa quis enim. In hac habitasse platea dictumst. Vivamus laoreet.
Donec id justo. Donec interdum, metus et hendrerit aliquet, dolor diam sagittis ligula, eget egestas libero turpis vel mi. Donec mollis hendrerit risus. Fusce ac felis sit amet ligula pharetra condimentum. Vivamus consectetuer hendrerit lacus.
</p></div></div>