当前位置:首页 > PHP教程 > php上传下载 > 列表

php+jQuery.uploadify实现文件上传教程

发布:smiling 来源: PHP粉丝网  添加日期:2021-05-04 18:53:23 浏览: 评论:0 

这篇文章主要介绍了php+jQuery.uploadify实现文件上传教程,需要的朋友可以参考下

这两天用上传的控件,PHP+Jquery今天先介绍这个uploadify,嗯,我今天下载因为我英文不是很好所以我就在网上找的使用教程,我发现好多用不了,我那个去,你看官方文档才知道很多API已经不是以前的API了。今天总结一下给大家,给大家一个提醒最多还是要看官方的http://www.uploadify.com/documentation/!

简单举例一下使用然后我都加上注释给大家,方便大家阅读和使用下载官方的之后直接使用就OK了,当然你需要什么在直接修改就可以了!代码如下:

  1. <!DOCTYPE HTML> 
  2. <html> 
  3. <head> 
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 
  5. <title>UploadiFy讲解</title> 
  6. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script> 
  7. <script src="jquery.uploadify.min.js" type="text/javascript"></script> 
  8. <link rel="stylesheet" type="text/css" href="uploadify.css"> 
  9. <style type="text/css"> 
  10. body { 
  11.  font: 13px Arial, Helvetica, Sans-serif; 
  12. </style> 
  13. </head> 
  14. <body> 
  15.  <h1>Uploadify讲解由widuu提供</h1> 
  16.  <form> 
  17.   <div id="queue"></div> 
  18.   <input id="file_upload" name="file_upload" type="file" multiple="true"> 
  19.  </form> 
  20.  <script type="text/javascript"> 
  21.   <?php $timetimestamp = time();?> 
  22.   $(function() { 
  23.    $('#file_upload').uploadify({ 
  24.      
  25.     //上传文件时post的的数据 
  26.     'formData'     : { 
  27.      'timestamp' : '<?php echo $timestamp;?>', 
  28.      'token'     : '<?php echo md5('unique_salt' . $timestamp);?>', 
  29.      'id'  : 1 
  30.     }, 
  31.     'swf'      : '/uploadify/uploadify.swf', 
  32.     'uploader' : 'http://localhost/uploadify/uploadify.php', 
  33.     'onInit'   : function(index){ 
  34.      alert('队列ID:'+index.settings.queueID); 
  35.     }, 
  36.     'method'   : 'post', //设置上传的方法get 和 post 
  37.     //'auto'    : false, //是否自动上传 false关闭自动上传 true 选中文件后自动上传 
  38.     //'buttonClass' : 'myclass', //自定义按钮的样式 
  39.     //'buttonImage' : '按钮图片', 
  40.     'buttonText'  : '选择文件', //按钮显示的字迹 
  41.     //'fileObjName' : 'mytest'  //后台接收的时候就是$_FILES['mytest'] 
  42.     'checkExisting' : '/uploadify/check-exists.php', //检查文件是否已经存在 返回0或者1 
  43.     'fileSizeLimit' : '100KB', //上传文件大小的限制 
  44.     'fileTypeDesc'  : '你需要一些文件',//可选择的文件的描述 
  45.     'fileTypeExts'  : '*.gif; *.jpg; *.png', //文件的允许上传的类型 
  46.      
  47.     //上传的时候发生的事件 
  48.     'onUploadStart' : function(file){ 
  49.       alert('开始上传了');       }, 
  50.     'uploadLimit'   : 5, //设置最大上传文件的数量 
  51.     /* 
  52.     'onUploadComplete' : function(result){ 
  53.         for (var i in result.post){ 
  54.          alert(i+':::'+result[i]); 
  55.         } 
  56.        }, 
  57.     */ 
  58.     //文件上传成功的时候 
  59.     'onUploadSuccess' : function(file, data, response) { 
  60.      alert(data); 
  61.      }, 
  62.      // 
  63.        'onUploadError' : function(file, errorCode, errorMsg, errorString) { 
  64.      alert(file.name + '上传失败原因:' + errorString); 
  65.      }, 
  66.      'itemTemplate' : '追加到每个上传节点的html', 
  67.      'height'  : 30, //设置高度 button 
  68.      'width'  : 30, //设置宽度 
  69.      'onDisable' : function(){ 
  70.       alert('您禁止上传'); 
  71.      }, 
  72.      'onEnable'  : function(){ 
  73.       alert('您可以继续上传了'); 
  74.      }, 
  75.      //当文件选中的时候 
  76.      'onSelect'  : function(file){ 
  77.       alert(file.name+"已经添加到队列"); 
  78.      } 
  79.    }); 
  80.   }); 
  81.    
  82.  //一些常用的事件 
  83.  //$('#file_upload').uploadify('upload','*');    //用javascript 上传的方法 
  84.  //$('#file_upload').uploadify('stop','*');      //用javascript 停止上传的方法 
  85.  //$('#file_upload').uploadify('disable','*');   //用javascript 禁止上传的方法 
  86.  //$('#file_upload').uploadify('settings','buttonText',"设置上传按钮");   //设置一些属性 
  87.  //更多的请到官方网站www.uploadify.com/documentation/看讲解谢谢 
  88.  </script> 
  89. <?php 
  90. /* 
  91.  *检查文件是否存在的check-exists.php 
  92.  */ 
  93. /* 
  94. $targetFolder = '/uploads'
  95. if (file_exists($_SERVER['DOCUMENT_ROOT'] . $targetFolder . '/' . $_POST['filename'])) { 
  96.  echo 1; 
  97. } else { 
  98.  echo 0; 
  99. */ 
  100. ?> 
  101. </body> 
  102. </html> 

代码注释里都做了详细解释了,我这里就不多废话了,如果还是有疑问,那就联系我吧。

Tags: php+jQuery uploadify

分享到: