Ajax+PHP实现的模拟进度条功能示例


Posted in PHP onFebruary 11, 2019

本文实例讲述了Ajax+PHP实现的模拟进度条功能。分享给大家供大家参考,具体如下:

一 代码

fun.js:

function progress(){
  setInterval("beginProgress()", 200);
}
function beginProgress(){
  $.get("progress.php", null, function(data){
     $("#pg").css("width", data+"%");
     $("#pgtext").html("The progress is "+data+"%");
  });
}

index.php:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>jQuery制作进度条</title>
</head>
<script language="javascript" src="js/jquery-1.3.2.js"></script>
<script language="javascript" src="js/fun.js"></script>
<body>
<div style="width:200px; height:12px; border:1px solid #0000FF">
  <div id="pg" style="width:0%; height:100%;background-color:#0000FF"></div>
</div>
<br>
<div id="pgtext" style="width:100px; height:20px"></div>
<br>
<input type="button" value="开始" onclick="progress()" />
</body>
</html>

progress.php:

<?php
$file = "./count.txt";
$fp = fopen($file, "r");
$txt = fread($fp, filesize($file));
echo $txt;
$fp1 = fopen($file, "w");
if($txt<100){
  $txt++;
  fwrite($fp1, $txt);
}else{
  fwrite($fp1, 1);
}
fclose($fp1);
fclose($fp);
?>

二 运行结果

Ajax+PHP实现的模拟进度条功能示例

希望本文所述对大家PHP程序设计有所帮助。

PHP 相关文章推荐
在 PHP 中使用随机数的三个步骤
Oct 09 PHP
PHP中文分词 自动获取关键词介绍
Nov 13 PHP
PHP中计算字符串相似度的函数代码
Dec 29 PHP
解析关于java,php以及html的所有文件编码与乱码的处理方法汇总
Jun 24 PHP
PHP获取一段文本显示点阵宽度和高度的方法
Mar 12 PHP
4种PHP异步执行的常用方式
Dec 24 PHP
PHP格式化MYSQL返回float类型的方法
Mar 30 PHP
php编译安装php-amq扩展简明教程
Jun 25 PHP
php中如何执行linux命令详解
Nov 06 PHP
laravel 修改.htaccess文件 重定向public的解决方法
Oct 12 PHP
php生成短网址/短链接原理和用法实例分析
May 29 PHP
php swoft框架实例用法
Dec 22 PHP
Ajax+Jpgraph实现的动态折线图功能示例
Feb 11 #PHP
php防止表单重复提交实例讲解
Feb 11 #PHP
stripos函数知识点实例分享
Feb 11 #PHP
PHP检查URL包含特定字符串实例方法
Feb 11 #PHP
PHP strripos函数用法总结
Feb 11 #PHP
PHP xpath()函数讲解
Feb 11 #PHP
Laravel框架实现超简单的分页效果示例
Feb 08 #PHP
You might like
通过php快速统计某个数据库中每张表的数据量
2012/09/04 PHP
PHP检查URL包含特定字符串实例方法
2019/02/11 PHP
ThinkPHP3.2.3框架实现执行原生SQL语句的方法示例
2019/04/03 PHP
jquery异步循环获取功能实现代码
2010/09/19 Javascript
解决js下referer兼容各大浏览器的方法
2014/11/03 Javascript
Javascript学习笔记之函数篇(四):arguments 对象
2014/11/23 Javascript
jQuery解决IE6、7、8不能使用 JSON.stringify 函数的问题
2016/05/31 Javascript
require.js+vue开发微信上传图片组件
2016/10/27 Javascript
JavaScript基于扩展String实现替换字符串中index处字符的方法
2017/06/13 Javascript
原生JS实现图片无缝滚动方法(附带封装的运动框架)
2017/10/01 Javascript
JS基于贪心算法解决背包问题示例
2017/11/27 Javascript
Vue-cli3项目配置Vue.config.js实战记录
2018/07/29 Javascript
Nodejs把接收图片base64格式保存为文件存储到服务器上
2018/09/26 NodeJs
vue动态渲染svg、添加点击事件的实现
2020/03/13 Javascript
基于js实现数组相邻元素上移下移
2020/05/19 Javascript
vue中全局路由守卫中替代this操作(this.$store/this.$vux)
2020/07/24 Javascript
Angular利用HTTP POST下载流文件的步骤记录
2020/07/26 Javascript
进一步了解Python中的XML 工具
2015/04/13 Python
django 创建过滤器的实例详解
2017/08/14 Python
python 实现tar文件压缩解压的实例详解
2017/08/20 Python
python读取和保存视频文件
2018/04/16 Python
Python机器学习库scikit-learn安装与基本使用教程
2018/06/25 Python
django ajax发送post请求的两种方法
2020/01/05 Python
Python3的socket使用方法详解
2020/02/18 Python
高清安全摄像头系统:Lorex Technology
2018/07/20 全球购物
大学生入党自我鉴定
2013/10/31 职场文书
探矿工程师自荐信
2014/01/24 职场文书
人事文员岗位职责
2014/02/16 职场文书
我们的节日春节活动方案
2014/08/22 职场文书
青春飞扬演讲稿
2014/09/11 职场文书
创新社会管理心得体会
2014/09/12 职场文书
终止劳动合同通知书
2015/04/16 职场文书
电影红河谷观后感
2015/06/11 职场文书
React Native项目框架搭建的一些心得体会
2021/05/28 Javascript
python分分钟绘制精美地图海报
2022/02/15 Python
Windows下载并安装MySQL8.0.x 版本的完整教程
2022/04/10 MySQL