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 ...
随机推荐
- PuTTY_0.67.0.0工具链接linux
1.虚拟机设置 在网络适配器中选中桥接模式,勾选复制物理网络链接状态(p)选项.点击确认. 2.开启虚拟机,检查是否安装有ssh服务器 a.查看是否启动ssh服务器 ps -a | grep ssh ...
- ASP.NET CORE--WIN10上无法单步调试解决方法
参考这篇文章 http://www.cnblogs.com/artech/p/debug-in-vs-code.html In order to be able to debug cross-plat ...
- BA-Delta知识点
问题: DSM-RTR的网络负载能力是怎样的?每条总线带32个模块吗?MS/TP总线上的模块需要拨地址码吗?最大可以承载多少个点? 答:理论值是30,最佳性能是21个,一般情况25-28个 linkn ...
- CF149D 区间dp
http://codeforces.com/problemset/problem/149/D D. Coloring Brackets time limit per test 2 seconds me ...
- Android App 内存泄露之Thread
Thread 内存泄露 线程也是造成内存泄露的一个重要的源头.线程产生内存泄露的主要原因在于线程生命周期的不可控. 1.看一下以下是否存在问题 <span style="white-s ...
- 开源ext2read代码走读之-在windows下怎样推断有几个硬盘设备?
int get_ndisks() { HANDLE hDevice; // handle to the drive to be examined int n ...
- 门面模式(Facade)
一:定义 提供一个统一的接口代表子系统内部的一组接口.门面模式提供一个高层的接口,使得子系统更易于使用. 二:经验 2.1 window系统的软关机(不是直接断电)是一个过程, 它自己背后会做很多 ...
- hadoop 计数器
一.hadoop有非常多自带的计数器,相信看过执行log的都会看到各种数据 二.用户自己定义计数器 在开发中常常须要记录错误的数据条数,就能够用计数器来解决. 1.定义:用一个枚举来定义一组计数器,枚 ...
- 英语发音规则---H字母
英语发音规则---H字母 一.总结 一句话总结: 1.H发[h]音? hot [hɒt] adj. 热的 house [haʊs] n. 住宅 head [hed] n. 头:头痛 hat [hæt] ...
- linux 安装redis zookeeper
安装redis: http://www.redis.cn/download.html 安装的前提条件: 需要安装gcc:yum install gcc-c++ wget http://download ...