根据后台加载数据,添加loading动画
<script>
var current = 0;
var hit = @hits;
$(this).scroll(function(){
var viewHeight =$(this).height();//可见高度
var contentHeight =$(".search_content").get(0).scrollHeight;//内容高度
var scrollHeight =$(this).scrollTop();//滚动高度
if(contentHeight - viewHeight < scrollHeight) {
if(current<hit)
{
$(".loading").css("display","block");
$.ajax({
url: "",
data:{
SearchKey:"",
current:current+15
},
async:true,
success: function(result){
var strhtml ="";
for (item in result.data)
{
strhtml += " <div class='info'>";
if (result.data[item].TitleFormat!="")
{
strhtml += " <a href='' target='_blank' class='ifone'>" + + "</a>";
}
else {
strhtml += " <a href='' target='_blank' class='ifone'>" + + "</a>";
}
strhtml += " <div class='oneimg'>";
strhtml += " <img src='/Content/img/searchBg.png' class='img-responsive' />";
strhtml += " </div>";
strhtml += " <div class='infobtm'>";
strhtml += " <span></span>";
strhtml += " <span>"+ result.data[item].PublishTime +"</span>";
strhtml += " <span></span>";
strhtml += " </div>";
strhtml += " </div>";
}
$(".search_content").append(strhtml);
}});
}else{
$(".loading").html("已经到底部了...");
}
}else{
$(".loading").css("display","none");
}
});
var contentif = $('div').is('.search_content'); //判断是否含有该类
if(contentif == true){
$(".loading").css("display","none");
}else{
$(".loading").addClass("loadingnoinfo");
$(".loading img").css("display","none");
$(".loading").html("没有搜索到内容 ...");
}
</script>
根据后台加载数据,添加loading动画的更多相关文章
- Android应用程序后台加载数据
从ContentProvider查询你需要显示的数据是比较耗时的.如果你在Activity中直接执行查询的操作,那么有可能导致Activity出现ANR的错误.即使没有发生ANR,用户也容易感知到一个 ...
- HighCharts 后台加载数据的时候去掉默认的 series
var chart; var options = { chart: { renderTo: 'container', type:'line' }, title: { text: '历史趋势时序图', ...
- MVC中使用Echart后台加载数据 实现饼图、折线图、全国地图数据,单击双击事件等
@{ Layout = null; } @if (false) { <script src="~/Js/jquery-easyui-1.5/jquery.min.js"> ...
- ionic 页面加载事件及loading动画
页面加载完成事件(非刷新情况下,页面切换是不会重复触发此事件的,只在第一次进入页面时触发,需要重复触发的话请使用 $ionicView.enter 事件) angular.module('app.co ...
- jQuery异步加载数据添加事件
几个月前在一个项目中涉及到树形栏,然后看了很多插件,觉得有点麻烦,于是自己写了一个,写着写着就出问题了. 当时项目是通过树形栏进行权限控制的,管理员可以对从数据库去的数据动态生成树形栏进行增删改查操作 ...
- angular5给懒加载模块添加loading
在根组件的构造函数中直接执行: this.router.events.subscribe(event=>{ if(event instanceof RouteConfigLoadEnd) { t ...
- 一个等待页面加载完毕的loading动画
1 html 部分 <!DOCTYPE html><html><head><meta http-equiv="Content-Type" ...
- Android动画之仿美团加载数据等待时,小人奔跑进度动画对话框(附顺丰快递员奔跑效果)
Android动画之仿美团加载数据等待时,小人奔跑进度动画对话框(附顺丰快递员奔跑效果) 首句依然是那句老话,你懂得! finddreams :(http://blog.csdn.net/finddr ...
- 当vue 页面加载数据时显示 加载loading
参考:https://www.jianshu.com/p/104bbb01b222 Vue 页面加载数据之前增加 `loading` 动画 创建组件 1.新建 .vue 文件: src -> c ...
随机推荐
- <BEA-141281> <unable to get file lock, will retry ...>
原文:http://gdutlzh.blog.163.com/blog/static/164746951201291903824812/ <BEA-141281> <unable t ...
- 我在tmux中最不可少的配置: 用鼠标切换窗口/调节分屏大小
前两天在给另外一个团队帮忙时,看他们在Rails日志.代码文件.git文件系统里面来回穿梭,觉得他们太累了,于是就介绍了 tmux 给他们用.但只讲了一点基本的开窗口.分屏,没给讲太多技巧,因为一下子 ...
- STM32 多通道ADC采样,采用Timer1进行采样率控制,利用DMA进行传输
http://blog.csdn.net/varding/article/details/17559399 http://www.51hei.com/stm32/3842.html https://w ...
- json转 PostMan bulk Edit application/x-www-form-urlencoded 需要的格式
{?\n\s*"([^"]+)"\s*:\s*"?([^,"]+)"?\s*,?}? $1:$2\n PostMan需要的格式. json转 ...
- [转]如何通过 App Store 审核(iOS 开发者经验分享)
CocoaChina交流社区曾经发起一个主题讨论,关于iOS开发者遇到审核失败的原因及解决办法的,有价值的回复内容如下: wubo9935 App中设计的图标与Apple原生图标类似,Apple原生图 ...
- VS Release模式调试
c++ -> 常规 -〉调试信息格式 选 程序数据库(/Zi)或(/ZI) c++ -> 优化 -〉优化 选 禁止(/Od) 连接器 -〉调试 -〉生成调试信息 选 是 (/DEBUG)
- findpanel 的相关代码
https://blog.csdn.net/zengcong2013/article/details/43118189 In addition to this method, you can use ...
- C#WinForm应用程序中嵌入ECharts图表
C#WinForm应用程序中嵌入ECharts图表 程序运行效果: 下载ECharts: 官网下载ECharts :http://echarts.baidu.com/download.html 或者直 ...
- 如何获取类或属性的自定义特性(Attribute)
如何获取类或属性的自定义特性(Attribute) 问题说明: 在ActiveRecord或者其他的ORM等代码中, 我们经常可以看到自定义特性(Attribute)的存在(如下面的代码所示) [Pr ...
- day_6.8 py 网络编程
2018-6-8 18:20:30 OSI模型:就是七层物理层 ICMP 我ping你的时候要用,不仅要知道ip地址和网卡号mac地址 ARP 在我和你通讯前不知道的mac地址需要广播一下,当我说的 ...