我可以使用scroll（）方法觸發Load（）函數嗎？

Question

我有一個腳本，當我點擊按鈕時加載一個php文件。

$(document).ready(function(){ 
     $('#loaded').on('click', function(){ 
     $("#phpContent").load('beach.php'); 
}); 

這項工作很好和load（）函數給我的文件，存在的問題是，當我改變的onClick功能，滾動功能，線路

$（「＃phpContent」 ）.load（ 'beach.php'）;

不再打電話或不工作

$(document).ready(function(){ 
    $('body').scroll(function(){ 
    $("#phpContent").load('beach.php'); 
}); 

所以load（）函數不能用這種方法調用？或者我在代碼中做錯了什麼？

Answer 1

在這兩個示例中都缺少右大括號。就滾動部分而言，我相當肯定在你滾動的時候會出現很多次。您可能只想在指定的滾動位置觸發。

Answer 2

下面的代碼工作，甚至爲此SO頁：

$(document).ready(function(){ 
    $(window).scroll(function() { 
     $("#phpContent").load('beach.php'); 
    }); 
}); 

Answer 3

全球集裝箱滾動事件上window解僱，而不是身體元素本身，所以你要聽其右側目的。

接下來，在下面的代碼片段中可以看到，這個調用會多次觸發。

const url = 'https://baconipsum.com/api/?type=all-meat&format=html'; 
 
$(window).scroll(event => $("#target").load(url));

body { height: 200vh; }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="target"></div>

假設你只希望這火在第一時間滾動頁面時，你可以使用jQuery.one，這隻會觸發一次。

const url = 'https://baconipsum.com/api/?type=all-meat&format=html'; 
 
$(window).one('scroll', event => $("#target").load(url));

body { height: 200vh; }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="target"></div>