[英]How do you make an Ajax call when a user scrolls down to the bottom of the screen
I would like to make an Ajax call when a user scrolls down to the bottom of the screen. 当用户向下滚动到屏幕底部时,我想拨打Ajax电话。 For some reason my code isn't working. 由于某种原因,我的代码无法正常工作。 I think it could be a syntax error but I checked my console and I don't see an error. 我认为这可能是语法错误,但是我检查了控制台,但没有看到错误。 Any suggestions, improvements or examples are welcomed. 欢迎任何建议,改进或示例。
<div id="content">
<?php include('post-1.php'); ?>
</div>
<div id="loading-image" style="display: none;"></div>
<div id="part2"></div>
<script>
window.onscroll = function(ev) {
if ((window.innerHeight + window.scrollY) >= document.body.offsetHeight) {
$('#loading-image').show();
$.ajax({
url: "<?php echo get_stylesheet_directory_uri();?>/post-2.php",
cache: false,
success: function(html){
$("#part2").html(result);
},
complete: function(){
$('#loading-image').hide();
}
});
}
};
</script>
You can use this.Works here 您可以在这里使用。
function CallAjax(){
$.ajax({
url: "<?php echo get_stylesheet_directory_uri();?>/post-2.php",
cache: false,
success: function(html){
$("#part2").html(result);
},
complete: function(){
$('#loading-image').hide();
}
});
}
$(window).scroll(function() {
var divTop = $('#yourDivId').offset().top,
divHeight = $('#yourDivId').outerHeight(),
wHeight = $(window).height(),
windowScrTp = $(this).scrollTop();
if (windowScrTp > (divTop+divHeight-wHeight)){
console.log('reached');
// add your ajax method here;
CallAjax();
}
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.