如何使用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>
答案 0 :(得分:1)
您的代码是正确的,必须解决
试试这个条件
($(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