ajax异步请求获取数据,实现滚动数字的效果。
BackgroundPositionAnimate.js下载
需要导入的js:
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/BackgroundPositionAnimate.js"></script>
展示数字滚动效果的html元素:
<div>
下载量:<span class="t_num"></span>次
</div>
通过异步请求获取数据:
function getdata(){
$.ajax({
url: 'data.php',
type: 'POST',
dataType: "json",
cache: false,
timeout: 10000,
error: function(){},
success: function(data){
show_num(data.count);
}
});
}
//表示查询传递的数字
function show_num(n){
var it = $(".t_num i");
var len = String(n).length;
for(var i=0;i<len;i++){
if(it.length<=i){
$(".t_num").append("<i></i>");
}
var num=String(n).charAt(i);
var y = -parseInt(num)*30; //y轴位置
var obj = $(".t_num i").eq(i);
obj.animate({ //滚动动画
backgroundPosition :'(0 '+String(y)+'px)'
}, 'slow','swing',function(){}
);
}
}
设置定时:
$(function(){
getdata();
setInterval('getdata()', 3000);//每隔3秒执行一次
});
ajax异步请求获取数据,实现滚动数字的效果。的更多相关文章
- 16 react 发送异步请求获取数据 和 使用Redux-thunk中间件进行 ajax 请求发送
1.发送异步请求获取数据 1.引入 axios ( 使用 yarn add axios 进行安装 ) import axios from 'axios'; 2. 模拟 在元素完成挂载后加载数据 并初始 ...
- uni-app如何解决在for循环里调用异步请求获取数据顺序混乱问题?
总结/朱季谦 先前有一次做uni-app的js接口对接时,遇到过这样的情况,在for循环里,调用一个异步请求时,返回来的值顺序是乱的,因此,在以下的代码里,push到数组里的值,每次的顺序可能都是不一 ...
- scrapy爬虫之模拟ajax post请求获取数据
实质:分析真实请求地址,根据规则构造新地址从而获得数据. 分析发现数据是通过异步ajax方式→post 获得的 于是通过分析response ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ 发现每次翻页 网 ...
- Ajax异步请求PHP数据
来源:http://www.ido321.com/1138.html 接到了老师的一个作业,实现的布局如图: 如果输入了科室ID,科室名字只显示与ID对应的,若没有输入,则显示全部,然后根据I科室名字 ...
- 【Spring学习笔记-MVC-5】利用spring MVC框架,实现ajax异步请求以及json数据的返回
作者:ssslinppp 时间:2015年5月26日 15:32:51 1. 摘要 本文讲解如何利用spring MVC框架,实现ajax异步请求以及json数据的返回. Spring MV ...
- jQuery使用ajax跨域请求获取数据
jQuery使用ajax跨域请求获取数据 跨域是我在日常面试中经常会问到的问题,这词在前端界出现的频率不低,主要原因还是由于安全限制(同源策略, 即JavaScript或Cookie只能访问同域下的 ...
- jquery的ajax异步请求接收返回json数据
http://www.jb51.net/article/51122.htm jquery的ajax异步请求接收返回json数据方法设置简单,一个是服务器处理程序是返回json数据,另一种就是ajax发 ...
- ajax异步请求不能刷新数据的问题
搞了两三天的问题,今天解决了.总结下: function reportGrpChange(cuid, title){ document.getElementById('reportFrameDiv') ...
- 09.VUE学习之watch监听属性变化实现类百度搜索栏功能ajax异步请求数据,返回字符串
cmd下安装axios npm install axios 安装好后,会多出node_modules文件夹 思路: 监听data里的word改变时,发送ajax异步请求数据, 把返回的数据赋值给dat ...
随机推荐
- 【hihocoder 1304】搜索一·24点
[题目链接]:http://hihocoder.com/problemset/problem/1304 [题意] [题解] 按照题目给的方法搜索就好; 那个方法很棒啊. 注意除0; 然后是浮点数的比较 ...
- CodeForcesGym 100641B A Cure for the Common Code
A Cure for the Common Code Time Limit: 3000ms Memory Limit: 262144KB This problem will be judged on ...
- [HTML5] Accessibility Implementation for complex component
When you developing a complex component by your own, one thing you cannot ignore is Accessibility. C ...
- CC2540 与 CC2541 差别 1
CC2540 的 1234 PIN 是 USB 功能,4 PIN 是 USB 的电压输入引脚. CC2541 没有 USB 功能.它的 1234 PIN 是 I2C 功能,为了与 CC2540 引脚兼 ...
- 【Android 初学】13、Broadcast Receiver
Broadcast Receiver Android广播机制包括三个基本要素:广播(Broadcast) - 用于发送广播.广播接收器(BroadcastReceiver) - 用于接收广播:意图内容 ...
- 利用flashback transaction query新特性进行事务撤销
具备了flashback version query查询的基础,我们就可以进行基于flashback version query的恢复.这就是flashback transaction query.f ...
- ORACLE查询闪回
在Oracle中如果错误地提交了修改操作,然后想查看修改前的值,这时候可以使用查询闪回(query flashback). 查询闪回可以根据根据一个时间值或者系统变更号(SCN)进行. 执行闪回操作, ...
- USACO 2.2 Preface Numbering
Preface Numbering A certain book's prefaces are numbered in upper case Roman numerals. Traditional R ...
- 如何使用github来展示自己的网页
项目文档或者单纯的html页面怎么用github来展示呢? 第一步:新建库 第二步: 上传自己的页面(index.html需在根目录下) 先把git库克隆下来 进入lineShop文件夹,拷贝自己的页 ...
- thinkPHP5 报错session_start(): No session id returned by function解决方法
这是因为用Redis接管了session状态储存,但是Redis又连接不正常导致的 在服务器上查看Redis运行状态一切正常,set.get也没有问题,最后琢磨了半天才发现是PHPRedis扩展没有安 ...