[英]How to show data when scroll page to bottom with append();
使用append();
滚动到底部时如何显示数据append();
?
首先,当您加载页面index.php时,它将显示88888和更多的br tag
当您将页面滚动到底部时,我想使用append()显示88888和更多br tag
; 功能,我该怎么做?
index.php
<script src="http://code.jquery.com/jquery-1.7.2.js"></script>
<script>
$("#fid").submit(f1());
</script>
<form method="post" id="fid" action="Javascript:void(0);" >
<input type='hidden' id='numbers' name='numbers' value='88888'/>
</form>
<div id="demoajax">
<script>
function f1(){
$('#demoajax').hide();
$.ajax({
url: 'demo.php',
type: 'POST',
data: $('#fid').serialize(),
success: function(data){
$('#demoajax').show();
$('#demoajax').html(data);
}
});
return false;
}
// on load page call function code //
$(document).ready(f1());
</script>
<script type="text/javascript">
$(document).ready(function(){
$(window).scroll(function(){
var height = $('#demoajax').height();
var scroll_top = $(this).scrollTop();
if(($(window).scrollTop() + $(window).height() == $(document).height())){
$('#demoajax').hide();
$('#protect_form_between_ajax_process').show();
$('#loading').show();
$.ajax({
url: 'demo.php',
type: 'POST',
data: $('#fid').serialize(),
success: function(data){
$('#demoajax').append(data);
}
});
return false;
}
return false;
});
});
</script>
demo.php
<?PHP
echo $_POST[numbers];
?>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
您的代码正确,必须正确
试试这个条件
($(window).scrollTop() + $(window).height() >= ( $(document).height() - 200)) // This will ensure that ajax call is send when there is 200px area left for user to scroll
要么
$(window).scrollTop() + $(window).height() == ( $(document).outerHeight(true)) // This will give the exact height
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.