php+ajax实现无刷新文件上传功能(ajaxuploadfile)


Posted in PHP onFebruary 11, 2018

本文实例为大家分享了php+ajax实现无刷新文件上传的具体代码,供大家参考,具体内容如下

文件上传的表单格式

<form id="uploadform" enctype="multipart/form-data" name="uploadform" method="post" >
  <input id="fileToUpload" type="file" name="fileToUpload" class="uploadinput" >
  <input id="add_file" type="button" value="提交">
</form>

AjaxFileUpload实现文件异步上传效果更好,使用简单:

<!DOCTYPE html>
 <html>
  <head>
   <title></title>
   <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
   <script type="text/javascript" src="http://www.phpddt.com/usr/themes/dddefault/jquery-1.4.2.min.js"></script>
   <script type="text/javascript" src="ajaxfileupload.js"></script>
  </head>
 <script>
 jQuery(function(){ 
  $("#buttonUpload").click(function(){  
   //加载图标 
   /* $("#loading").ajaxStart(function(){
   $(this).show();
   }).ajaxComplete(function(){
   $(this).hide();
   });*/
   //上传文件
  $.ajaxFileUpload({
   url:'upload.php',//处理图片脚本
   secureuri :false,
   fileElementId :'fileToUpload',//file控件id
   dataType : 'json',
   success : function (data, status){
    if(typeof(data.error) != 'undefined'){
     if(data.error != ''){
      alert(data.error);
     }else{
      alert(data.msg);
     }
    }
   },
   error: function(data, status, e){
    alert(e);
   }
 })
 return false;
  }) 
 })
 </script>
  <body>
   <input id="fileToUpload" type="file" size="20" name="fileToUpload" class="input">
   <button id="buttonUpload">上传</button>
  </body>
 </html>

上传还可以传递参数:

var data = { name: 'my name', description: 'short description' } 
  $.ajaxFileUpload({
   url: 'upload.php',
   secureuri: false,
   data: data,
   fileElementId: 'fileToUpload',
   dataType: 'json',
   success: function (data) {
    alert(data.msg);

   },
   error: function (data) {
    alert("error");
   }
  });

主要参数说明:

1、url表示处理文件上传操作的文件路径,可以测试URL是否能在浏览器中直接访问,如上:upload.php
2、fileElementId表示文件域ID,如上:fileToUpload
3、secureuri是否启用安全提交,默认为false
4、dataType数据数据,一般选json,javascript的原生态
5、success提交成功后处理函数
6、error提交失败处理函数

需要了解相关的错误提示

1、SyntaxError: missing ; before statement错误

如果出现这个错误就需要检查url路径是否可以访问

2,SyntaxError: syntax error错误

如果出现这个错误就需要检查处理提交操作的PHP文件是否存在语法错误

3、SyntaxError: invalid property id错误

如果出现这个错误就需要检查属性ID是否存在

4、SyntaxError: missing } in XML expression错误

如果出现这个错误就需要检查文件域名称是否一致或不存在

5、其它自定义错误

大家可使用变量$error直接打印的方法检查各参数是否正确,比起上面这些无效的错误提示还是方便很多。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

PHP 相关文章推荐
十天学会php(1)
Oct 09 PHP
一个查看session内容的函数
Oct 09 PHP
fetchAll()与mysql_fetch_array()的区别详解
Jun 05 PHP
深入解析PHP 5.3.x 的strtotime() 时区设定 警告信息修复
Aug 05 PHP
采用header定义为文件然后readfile下载(隐藏下载地址)
Jan 31 PHP
完美解决thinkphp验证码出错无法显示的方法
Dec 09 PHP
php实现无限级分类
Dec 24 PHP
WordPress中重置文章循环的rewind_posts()函数讲解
Jan 11 PHP
Laravel模糊查询区分大小写的实例
Sep 29 PHP
通过PHP的Wrapper无缝迁移原有项目到新服务的实现方法
Apr 02 PHP
php屏蔽错误及提示的方法
May 10 PHP
利用ajax+php实现商品价格计算
Mar 31 PHP
PHP实现的多维数组排序算法分析
Feb 10 #PHP
ThinkPHP整合datatables实现服务端分页的示例代码
Feb 10 #PHP
PHP实现APP微信支付的实例讲解
Feb 10 #PHP
PHP有序表查找之插值查找算法示例
Feb 10 #PHP
PHP有序表查找之二分查找(折半查找)算法示例
Feb 09 #PHP
php在windows环境下获得cpu内存实时使用率(推荐)
Feb 08 #PHP
PHP基于redis计数器类定义与用法示例
Feb 08 #PHP
You might like
PHP中文编码小技巧
2014/12/25 PHP
PHP函数shuffle()取数组若干个随机元素的方法分析
2016/04/02 PHP
PHP的swoole扩展安装方法详细教程
2016/05/18 PHP
php函数传值的引用传递注意事项分析
2016/06/25 PHP
jquery 防止表单重复提交代码
2010/01/21 Javascript
用js实现控件的隐藏及style.visibility的使用
2013/06/14 Javascript
JavaScript关闭当前页面(窗口)不带任何提示
2014/03/26 Javascript
如何防止回车(enter)键提交表单
2014/05/11 Javascript
简单分析javascript面向对象与原型
2015/05/21 Javascript
深入学习JavaScript的AngularJS框架中指令的使用方法
2016/03/05 Javascript
聊一聊JavaScript作用域和作用域链
2016/05/03 Javascript
微信小程序 详解Page中data数据操作和函数调用
2017/01/12 Javascript
nginx+vue.js实现前后端分离的示例代码
2018/02/12 Javascript
JS对象与json字符串相互转换实现方法示例
2018/06/14 Javascript
使用Python脚本将Bing的每日图片作为桌面的教程
2015/05/04 Python
对python append 与浅拷贝的实例讲解
2018/05/04 Python
python抓取网站的图片并下载到本地的方法
2018/05/22 Python
python删除本地夹里重复文件的方法
2020/11/19 Python
使用Python处理Excel表格的简单方法
2018/06/07 Python
python代码过长的换行方法
2018/07/19 Python
python科学计算之numpy——ufunc函数用法
2019/11/25 Python
python实现从wind导入数据
2019/12/03 Python
python实现打砖块游戏
2020/02/25 Python
突袭HTML5之Javascript API扩展2—地理信息服务及地理位置API学习
2013/01/31 HTML / CSS
在canvas上实现元素图片镜像翻转动画效果的方法
2018/03/20 HTML / CSS
eBay法国购物网站:eBay.fr
2017/10/21 全球购物
英国最大的在线奢侈手表零售商:Jura Watches
2018/01/29 全球购物
创建索引时需要注意的事项
2013/05/13 面试题
运动会加油口号
2014/06/07 职场文书
五四青年节的活动方案
2014/08/20 职场文书
学校查摆问题整改措施
2014/09/28 职场文书
商家认证委托书格式
2014/10/16 职场文书
2015年城管个人工作总结范文
2015/04/20 职场文书
军事理论课感想
2015/08/11 职场文书
老干部局2015年度工作总结
2015/10/22 职场文书
SpringBoot 集成短信和邮件 以阿里云短信服务为例
2022/04/22 Java/Android