在滚动事件中使用 Jquery

Question

滚动页面时，我无法在 console.log 中显示文本。

 $("#idOfUl").on('scroll', function() { console.log('Event Fired'); });

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div id="idOfUl"> <ul> <li> You can use the overflow property when you want to have better control of the layout. The default value is visible. You can use the overflow property when you want to have better control of the layout. The default value is visible. You can use the overflow property when you want to have better control of the layout. The default value is visible. You can use the overflow property when you want to have better control of the layout. The default value is visible. You can use the overflow property when you want to have better control of the layout. The default value is visible. </li> <li> You can use the overflow property when you want to have better control of the layout. The default value is visible. You can use the overflow property when you want to have better control of the layout. The default value is visible. You can use the overflow property when you want to have better control of the layout. The default value is visible. You can use the overflow property when you want to have better control of the layout. The default value is visible. You can use the overflow property when you want to have better control of the layout. The default value is visible. </li> <li> You can use the overflow property when you want to have better control of the layout. The default value is visible. You can use the overflow property when you want to have better control of the layout. The default value is visible. You can use the overflow property when you want to have better control of the layout. The default value is visible. You can use the overflow property when you want to have better control of the layout. The default value is visible. You can use the overflow property when you want to have better control of the layout. The default value is visible. </li> <li> You can use the overflow property when you want to have better control of the layout. The default value is visible. You can use the overflow property when you want to have better control of the layout. The default value is visible. You can use the overflow property when you want to have better control of the layout. The default value is visible. You can use the overflow property when you want to have better control of the layout. The default value is visible. You can use the overflow property when you want to have better control of the layout. The default value is visible. </li> <li> You can use the overflow property when you want to have better control of the layout. The default value is visible. You can use the overflow property when you want to have better control of the layout. The default value is visible. You can use the overflow property when you want to have better control of the layout. The default value is visible. You can use the overflow property when you want to have better control of the layout. The default value is visible. You can use the overflow property when you want to have better control of the layout. The default value is visible. </li> <li> You can use the overflow property when you want to have better control of the layout. The default value is visible. You can use the overflow property when you want to have better control of the layout. The default value is visible. You can use the overflow property when you want to have better control of the layout. The default value is visible. You can use the overflow property when you want to have better control of the layout. The default value is visible. You can use the overflow property when you want to have better control of the layout. The default value is visible. </li> </ul> </div>

滚动页面时，我无法在 console.log 中显示文本。

滚动页面时，我无法在 console.log 中显示文本。

滚动页面时，我无法在 console.log 中显示文本。

滚动页面时，我无法在 console.log 中显示文本。

滚动页面时，我无法在 console.log 中显示文本。

Answer 1

该元素需要是可滚动的（带有overflow:scroll ）。

 $("#idOfUl").scroll(function() { console.log('Event Fired'); });

 #idOfUl { height: 100vh; overflow: scroll; }

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div id="idOfUl"> <ul> <li> You can use the overflow property when you want to have better control of the layout. The default value is visible. You can use the overflow property when you want to have better control of the layout. The default value is visible. You can use the overflow property when you want to have better control of the layout. The default value is visible. You can use the overflow property when you want to have better control of the layout. The default value is visible. You can use the overflow property when you want to have better control of the layout. The default value is visible. </li> <li> You can use the overflow property when you want to have better control of the layout. The default value is visible. You can use the overflow property when you want to have better control of the layout. The default value is visible. You can use the overflow property when you want to have better control of the layout. The default value is visible. You can use the overflow property when you want to have better control of the layout. The default value is visible. You can use the overflow property when you want to have better control of the layout. The default value is visible. </li> <li> You can use the overflow property when you want to have better control of the layout. The default value is visible. You can use the overflow property when you want to have better control of the layout. The default value is visible. You can use the overflow property when you want to have better control of the layout. The default value is visible. You can use the overflow property when you want to have better control of the layout. The default value is visible. You can use the overflow property when you want to have better control of the layout. The default value is visible. </li> <li> You can use the overflow property when you want to have better control of the layout. The default value is visible. You can use the overflow property when you want to have better control of the layout. The default value is visible. You can use the overflow property when you want to have better control of the layout. The default value is visible. You can use the overflow property when you want to have better control of the layout. The default value is visible. You can use the overflow property when you want to have better control of the layout. The default value is visible. </li> <li> You can use the overflow property when you want to have better control of the layout. The default value is visible. You can use the overflow property when you want to have better control of the layout. The default value is visible. You can use the overflow property when you want to have better control of the layout. The default value is visible. You can use the overflow property when you want to have better control of the layout. The default value is visible. You can use the overflow property when you want to have better control of the layout. The default value is visible. </li> <li> You can use the overflow property when you want to have better control of the layout. The default value is visible. You can use the overflow property when you want to have better control of the layout. The default value is visible. You can use the overflow property when you want to have better control of the layout. The default value is visible. You can use the overflow property when you want to have better control of the layout. The default value is visible. You can use the overflow property when you want to have better control of the layout. The default value is visible. </li> </ul> </div>