jquery插件uploadify多图上传功能实现代码

前端之家收集整理的这篇文章主要介绍了jquery插件uploadify多图上传功能实现代码前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

本文实例为大家分享了uploadify多图上传具体实现代码,可动态添加上传框,供大家参考,具体内容如下

<!DOCTYPE HTML>

<Meta http-equiv="Content-Type" content="text/html; charset=utf-8"> UploadiFive Test

Uploadify Demo

<div class='file'>

 <input id="file_upload1" name="file_upload" type="file" multiple="true"&gt;

</div>

<a href="javascript:;" class="clickUpload"> 点击

<script type="text/javascript">

<?php $timestamp = time();?>
$(function() {

var i=2;
$('.clickUpload').click(function(){
var html='';
html+='<div class="file"><input id="file_upload'+i+'" name="file_upload" type="file" multiple="true">

';

$('.form_file').append(html);

 $('#file_upload'+i).uploadify({

  'formData'  : {
   'timestamp' : '<?php echo $timestamp;?>','token'  : '<?php echo md5('unique_salt' . $timestamp);?>'
  },'swf'  : 'uploadify.swf','uploader' : 'uploadify.php','width'   : '120','fileTypeExts': '*.gif; *.jpg; *.png','buttonText': '上传图片','removeCompleted' : false,'multi' : true,//允许多图上传



  //上传成功后执行
  'onUploadSuccess': function (file,data,response) {
   $('#' + file.id).find('.data').html(' 上传完毕');
  }


 });
i++;

})

$('#file_upload1').uploadify({

'formData'  : {
 'timestamp' : '<?php echo $timestamp;?>','token'  : '<?php echo md5('unique_salt' . $timestamp);?>'
},//允许多图上传



//上传成功后执行
'onUploadSuccess': function (file,response) {
 $('#' + file.id).find('.data').html(' 上传完毕');
}

});

});

更多精彩内容,请点击,进行深入学习和研究。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持编程之家。

原文链接:https://www.f2er.com/jquery/46618.html

猜你在找的jQuery相关文章