![](/img/trans.png)
[英]how to change the default load ajax loader gif in jquery mobile
[英]How to load and stop Ajax based vertical scroll function + gif image loader
我还没有完全实现这一目标。 问题在于此功能只能工作一次然后停止。 我在这里错过循环吗?
我试图将else { }
块移到else { }
地方,但这无济于事。 我也曾尝试将条件设为else if (data=='')
但这也无济于事。
如果我移动此功能
if($(window).scrollTop() + $(window).height() > $("#load_data").height() && action == 'inactive') {
在if(data !=='')
之外,即使从数据库中获取了最后一个原始if(data !=='')
我的滚动功能和gif图像也不会停止 。
任何帮助,将不胜感激。 谢谢!
<script>
var limit = 20;
var start = 0;
var action = 'inactive';
var timeOutId;
function load_city_data(limit, start) {
$.ajax({
url:"ps_load_data.php",
method:"POST",
data:{limit:limit, start:start},
cache:false,
success:function(data) {
$('#load_data').append(data);
if(data !== '') {
$('#imgLoader').html('<img class="animated-gif" src="img/ajax-loader.gif">');
action = "inactive";
$(window).scroll(function(){
if($(window).scrollTop() + $(window).height() > $("#load_data").height() && action == 'inactive') {
action = 'active';
start = start + limit;
timeOutId = setTimeout(function(){
load_city_data(limit, start);
}, 1000);
}
else {
$('#load_data_message').html('<div class="reached">You have reached at the end of the listings</div>');
action = 'active';
$(window).off('scroll');
clearTimeout(timeOutId);
$('img[src="img/ajax-loader.gif"]').remove();
}
});
}
}
});
}
$(document).ready(function(){
if(action == 'inactive') {
action = 'active';
load_city_data(limit, start);
}
});
</script>
使用exit();
在while循环结束后立即执行。 即使您在ps_load_data.php中运行多个查询,它也可以工作。
这里提到了答案: MySql获取所有数据后如何停止滚动功能
另外,这是工作脚本
$(document).ready(function(){
var limit = 100;
var start = 0;
var action = 'inactive';
function load_country_data(limit, start)
{
$.ajax({
url:"ps_load_data.php",
method:"POST",
data:{limit:limit, start:start},
cache:false,
success:function(data)
{
$('#load_data').append(data);
if(data == '')
{
$('#load_data_message').html("No Data Found");
action = 'active';
}
else
{
$('#load_data_message').html("<img src='img/ajax-loader.gif'>");
action = "inactive";
}
}
});
}
if(action == 'inactive')
{
action = 'active';
load_country_data(limit, start);
}
$(window).scroll(function(){
if($(window).scrollTop() + $(window).height() > $("#load_data").height() && action == 'inactive')
{
action = 'active';
start = start + limit;
setTimeout(function(){
load_country_data(limit, start);
}, 2000);
}
});
});
只要确保您的url:“ ps_load_data.php”仅运行一个正在获取的查询 ,否则它将发生冲突,即使在获取了最后一行数据后也可能不会隐藏/停止您的gif图像。 谢谢!
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.