JQuery和PHP结合实现动态进度条上传显示


Posted in Javascript onNovember 23, 2016

Windows 环境下的修改方法

第一步:修改在php5下POST文件大小的限制

1.编修php.ini

找到:max_execution_time = 30 ,这个是每个脚本运行的最长时间,单位秒,改为:max_execution_time = 150

找到:max_input_time = 60,这是每个脚本可以消耗的时间,单位也是秒,修改为:

max_input_time = 300

找到:memory_limit = 128M,这个是脚本运行最大消耗的内存,根据你的需求更改数值,这里修改为:memory_limit = 256M

找到:post_max_size = 8M,表单提交最大数据为 8M,此项不是限制上传单个文件的大小,而是针对整个表单的提交数据进行限制的。限制范围包括表单提交的所有内容.例如:发表贴子时,贴子标题,内容,附件等…这里修改为:post_max_size = 20M

找到:upload_max_filesize = 2M ,上载文件的最大许可大小 ,修改为: upload_max_filesize = 10M (这里的大小根据需求来定)

第二步: Apache环境中的档案上传大小控制

修改位于Apahce目录下的httpd.conf

添加下面内容

LimitRequestBody 10485760

即10M=10*1024*1024,有的文章中提到应改为 600000000

重新启动apache,就可以在设置里看到你要的大小

HTML部分

<form action="index/index/upload" method="POST" enctype="multipart/from-data" id="uploadform" onSubmit="return false">
<div class="inpuys">
<input type="file" name="file" id="uploadfile" value="选择文件" class="cho">
<input type="submit" value="上传" id="submit_btn" class="sub btn btn-info">
</div>
</form>

JS部分

<script type="text/javascript" src="{$Think.config.web_root}js/jquery.min.js"></script>
<script type="text/javascript" src="{$Think.config.web_root}js/jquery.form.js"></script>
<script src="http://cdn.bootcss.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
var progressbox=$("#progressbox");
var progressbar=$("#progressbar");
var progress=$("#progress");
var completed="0%";
var options={
beforeSubmit:beforeSubmit,
uploadProgress:OnProgress,
success:afterSuccess,
resetForm:true
};
$("#uploadform").submit(function(){
$(this).ajaxSubmit(options);
return false;
});
function OnProgress(event,position,total,percentComplete ) {
progressbar.width(percentComplete + "%");
progress.html(percentComplete + "%");
}
function afterSuccess(){
$("#output").html("上传完成!!");
}
function beforeSubmit(){
if (!$("#uploadfile").val()) {
$("#output").html("请选择文件!!");
return false;
}
progressbar.width(completed);
progress.html(completed);
}
});
</script>

THINKPHP方法部分

public function upload(){
// 获取表单上传文件 例如上传了001.jpg
$file = request()->file('file');
// 移动到框架应用根目录/public/uploads/ 目录下
$info = $file->move(ROOT_PATH . 'public' . DS . 'uploads');
if($info){
return "上传成功";
}else{
// 上传失败获取错误信息
echo $file->getError();
}
}

以上所述是小编给大家介绍的JQuery和PHP结合实现动态进度条上传显示,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
解决FLASH需要点击激活的代码
Dec 20 Javascript
对象无length属性时IE6/IE7中无法将其转换成伪数组(ArrayLike)
Jul 31 Javascript
处理及遍历XML文档DOM元素属性及方法整理
Aug 23 Javascript
URL的参数中有加号传值变为空格的问题(URL特殊字符)
Nov 04 Javascript
详解Python中logging日志模块在多进程环境下的使用
Dec 26 Javascript
H5实现仿flash效果的实现代码
Sep 29 Javascript
Vue.js划分组件的方法
Oct 29 Javascript
Node.js笔记之process模块解读
May 31 Javascript
7个好用的JavaScript技巧分享(译)
May 07 Javascript
基于javascript实现贪吃蛇小游戏
Nov 25 Javascript
node.js使用yargs处理命令行参数操作示例
Feb 11 Javascript
React实现todolist功能
Dec 28 Javascript
ionic进入多级目录后隐藏底部导航栏(tabs)的完美解决方案
Nov 23 #Javascript
JQueryEasyUI之DataGrid数据显示
Nov 23 #Javascript
详解获取jq ul第一个li定位的四种解决方案
Nov 23 #Javascript
jquery实现点击页面回到顶部
Nov 23 #Javascript
通过原生JS实现为元素添加事件的方法
Nov 23 #Javascript
微信小程序开发一键登录 获取session_key和openid实例
Nov 23 #Javascript
JavaScript基于自定义函数判断变量类型的实现方法
Nov 23 #Javascript
You might like
为php4加入动态flash文件的生成的支持
2006/10/09 PHP
php array_slice函数的使用以及参数详解
2008/08/30 PHP
PHP 调试工具Debug Tools
2011/04/30 PHP
ueditor 1.2.6 使用方法说明
2013/07/24 PHP
php把session写入数据库示例
2014/02/26 PHP
PHP网页游戏学习之Xnova(ogame)源码解读(十五)
2014/06/30 PHP
thinkphp3.x连接mysql数据库的方法(具体操作步骤)
2016/05/19 PHP
Js 获取HTML DOM节点元素的方法小结
2009/04/24 Javascript
JSQL 基于客户端的成绩统计实现方法
2010/05/05 Javascript
javascript数字数组去重复项的实现代码
2010/12/30 Javascript
基于jquery的分页控件(C#)
2011/01/06 Javascript
JavaScript中的几个关键概念的理解-原型链的构建
2011/05/12 Javascript
使用node+vue.js实现SPA应用
2016/01/28 Javascript
开源免费天气预报接口API及全国所有地区代码(国家气象局提供)
2016/12/26 Javascript
three.js快速入门【推荐】
2017/01/21 Javascript
Bootstrap页面缩小变形的快速解决办法
2017/02/03 Javascript
jquery横向纵向鼠标滚轮全屏切换
2017/02/27 Javascript
Django+Vue.js搭建前后端分离项目的示例
2017/08/07 Javascript
jQuery实现的手动拖动控制进度条效果示例【测试可用】
2018/04/18 jQuery
关于React动态加载路由处理的相关问题
2019/01/07 Javascript
VUE实时监听元素距离顶部高度的操作
2020/07/29 Javascript
vue3为什么要用proxy替代defineProperty
2020/10/19 Javascript
[37:22]DOTA2上海特级锦标赛D组资格赛#2 Liquid VS VP第一局
2016/02/28 DOTA
使用url_helper简化Python中Django框架的url配置教程
2015/05/30 Python
Python抓取手机号归属地信息示例代码
2016/11/28 Python
Python实现随机生成有效手机号码及身份证功能示例
2017/06/05 Python
Python编程之字符串模板(Template)用法实例分析
2017/07/22 Python
Python Django给admin添加Action的方法实例详解
2019/04/29 Python
python判断无向图环是否存在的示例
2019/11/22 Python
新闻发布会主持词
2014/03/28 职场文书
优秀毕业生自荐信
2014/06/10 职场文书
罚站检讨书
2015/01/29 职场文书
教师节大会主持词
2015/07/06 职场文书
深入理解以DEBUG方式线程的底层运行原理
2021/06/21 Java/Android
IDEA2021.2配置docker如何将springboot项目打成镜像一键发布部署
2021/09/25 Java/Android
《总之就是很可爱》新作短篇动画《总之就是很可爱~制服~》将于2022年夏天播出
2022/04/07 日漫