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 相关文章推荐
JS中encodeURIComponent函数用php解码的代码
Mar 01 PHP
用php实现百度网盘图片直链的代码分享
Nov 01 PHP
解析将多维数组转换为支持curl提交的一维数组格式
Jul 08 PHP
php像数组一样存取和修改字符串字符
Mar 21 PHP
php调用nginx的mod_zip模块打包ZIP文件
Jun 11 PHP
PHP实现一维数组转二维数组的方法
Feb 25 PHP
PHP date函数常用时间处理方法
May 11 PHP
php实现倒计时效果
Dec 19 PHP
php基于curl实现的股票信息查询类实例
Nov 11 PHP
php常用数组函数实例小结
Dec 29 PHP
PHP面向对象程序设计模拟一般面向对象语言中的方法重载(overload)示例
Jun 13 PHP
PHP7 字符串处理机制修改
Mar 09 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中文处理 中文字符串截取(mb_substr)和获取中文字符串字数
2011/11/10 PHP
WordPress中获取页面链接和标题的相关PHP函数用法解析
2015/12/17 PHP
PHP Try-catch 语句使用技巧
2016/02/28 PHP
PHP上传图片到数据库并显示的实例代码
2019/12/20 PHP
WordPress免插件实现面包屑导航的示例代码
2020/08/20 PHP
为指定元素增加样式的js代码
2009/12/09 Javascript
基于jquery的鼠标拖动效果代码
2012/05/30 Javascript
js实现iframe跨页面调用函数的方法
2014/12/13 Javascript
JavaScript实现的多种鼠标拖放效果
2015/11/03 Javascript
js实时获取窗口大小变化的实例代码
2016/11/18 Javascript
Vue方法与事件处理器详解
2016/12/01 Javascript
JS简单获取当前日期时间的方法(如:2017-03-29 11:41:10 星期四)
2017/03/29 Javascript
深入理解 JavaScript 中的 JSON
2017/04/06 Javascript
JSX在render函数中的应用详解
2019/09/04 Javascript
Python自定义函数的创建、调用和函数的参数详解
2014/03/11 Python
python并发编程之多进程、多线程、异步和协程详解
2016/10/28 Python
利用python实现命令行有道词典的方法示例
2017/01/31 Python
Python入门之后再看点什么好?
2018/03/05 Python
python3 中的字符串(单引号、双引号、三引号)以及字符串与数字的运算
2019/07/18 Python
python 比较字典value的最大值的几种方法
2020/04/17 Python
django和flask哪个值得研究学习
2020/07/31 Python
python爬取代理IP并进行有效的IP测试实现
2020/10/09 Python
Django解决frame拒绝问题的方法
2020/12/18 Python
DHC美国官网:日本通信销售第一的化妆品品牌
2017/11/12 全球购物
Charles & Colvard官网:美国莫桑石品牌
2019/06/05 全球购物
土耳其玩具商店:Toyzz Shop
2019/08/02 全球购物
init进程的作用
2015/08/20 面试题
挂靠协议书范本
2014/04/22 职场文书
公司投资建议书
2014/05/16 职场文书
婚庆答谢词
2015/01/04 职场文书
北京颐和园导游词
2015/01/30 职场文书
出国留学单位推荐信
2015/03/26 职场文书
社区文明创建工作总结2015
2015/04/21 职场文书
导游词之潮音寺
2019/09/26 职场文书
html form表单基础入门案例讲解
2021/07/21 HTML / CSS
MySQL 数据表操作
2022/05/04 MySQL