javascript - 请告诉我为什么我的 $(window).scrolltop() 不适用于所有浏览器
问题描述
<script type="text/javascript">
$(document).ready(function(){
$(window).scroll(function(){
var lastID = $('.load-more').attr('lastID');
if(($(window).scrollTop() == $(document).height() - $(window).height())
&& (lastID != 0)){
$.ajax({
url:"main_feed_ajax.php",
method:"POST",
data:'feed_id='+lastID,
cache:false,
beforeSend:function(){
$('.load-more').show();
},
success:function(html){
$('.load-more').remove();
$('#postList').append(html);
}
});
}
});
});
</script>
我有此代码用于在不刷新页面的情况下加载滚动数据。我的代码仅适用于少数几个浏览器。此外,它不适用于使用 google chrome、firefox 的移动设备和平板电脑。只有它适用于 Internet Explorer 和一些 chrome 浏览器。所以,请建议我在此代码中需要更改的内容。Index.php 页面
<div id="postList">
<?php
// Include the database configuration file
require 'dbConfig.php';
// Get records from the database
$query = $db->query("SELECT * FROM user_post ORDER BY feed_id DESC LIMIT
5");
if($query->num_rows > 0){
while($row = $query->fetch_assoc()){
$postID = $row["feed_id"];
$feed_text = $row["feed_text"];
?>
<div class="list-item"><h4><?php echo $feed_text; ?></h4><img
style="width:200px; height:200px;" src="car.jpg"></div>
<?php } ?>
<div class="load-more" lastID="<?php echo $postID; ?>" style="display:
none;">
<img src="loader.gif"/>
</div>
<?php } ?>
</div>
main_feed_ajax.php 页面
<?php
if(!empty($_POST["feed_id"])){
//Include DB configuration file
$server_access_name="localhost";
$server_access_id="root";
$server_access_pass_code="";
$server_access_batabase_name="inkme";
// Create connection
$conn_server_link = mysqli_connect($server_access_name, $server_access_id,
$server_access_pass_code, $server_access_batabase_name);
if(!$conn_server_link){
echo "!Ops, Unable to connect ";
}
//Get last ID
$lastID = $_POST['feed_id'];
//Limit on data display
$showLimit = 5;
//Get all rows except already displayed
$queryAll = $conn_server_link->query("SELECT COUNT(*) as num_rows FROM
user_post WHERE feed_id < ".$lastID." ORDER BY feed_id DESC");
$rowAll = $queryAll->fetch_assoc();
$allNumRows = $rowAll['num_rows'];
//Get rows by limit except already displayed
$query = $conn_server_link->query("SELECT * FROM user_post WHERE feed_id <
".$lastID." ORDER BY feed_id DESC LIMIT ".$showLimit);
if($query->num_rows > 0){
while($row = $query->fetch_assoc()){
$postID = $row["feed_id"];
$feed_text = $row["feed_text"];
?>
<div class="list-item"><h4><?php echo $feed_text; ?></h4><img
style="width:200px; height:200px;" src="car.jpg"></div>
<?php } ?>
<?php if($allNumRows > $showLimit){ ?>
<div class="load-more" lastID="<?php echo $postID; ?>" style="display:
none;">
<img src="loader.gif"/>
</div>
<?php }else{ ?>
<div class="load-more" lastID="0">
No more feeds
</div>
<?php }
}
else{ ?>
<div class="load-more" lastID="0">
That's All!
</div>
<?php
}
}
?>
解决方案
推荐阅读
- alert - Grafana:定义比率警报
- javascript - 与 React 的外部链接
- java - 初始化二维数组 - 密码表
- html - 在 aspx 文件中无法识别 CSS
- python - assertRaises(AttributeError, ...) 不起作用。模块“myModule”没有属性“main”(Python 单元测试)
- rust - 为大量结构实现特征时如何防止代码重复
- windows - 是否有用于获取桌面上图标位置的 Windows API?
- java - 为什么在使用 listIterator.add() 时会出现 noSuchElementException?
- game-development - 如何在游戏制作者 2 中从枪管中发射子弹 [已解决]
- python - 如何在特殊解析函数内的 ply-yacc 中引发错误?