uploadify上传插件的的使用-白红宇

uploadify上传插件的的使用

阅读量：5309 次

发布时间：2019-06-14

本文共 5578 字，大约阅读时间需要 18 分钟。

uploadify上传插件的的使用

//js引用

$(document).ready(function(){

//单文件上传配置

$(“#uploadify”).uploadify({

’uploader’ : ‘/Public/uploadify/uploadify.swf’,

’script’ : ‘/Public/uploadify/uploadify.php’,

’cancelImg’ : ‘/Public/uploadify/cancel.png’,

’folder’ : ‘/Public/pictures/homes/enterprise/<?php echo date(“Ymd”,strtotime(“now”))?>/’,

’queueID’ : ‘fileQueue’,

’fileExt’ : ‘*.jpg;*.gif;*.bmp;*.png’, //允许文件上传类型,和fileDesc一起使用.

’fileDesc’ : ‘*.jpg;*.gif;*.bmp;*.png’, //将不允许文件类型,不在浏览对话框的出现.

‘removeCompleted’ : true,

‘sizeLimit’ : 102400,

‘queueSizeLimit’ : 1,

‘simUploadLimit’ : 1,

’onComplete’:function(event,queueId,fileObj,response,data){

$(‘#fileQueue’).html( ‘<div id=”uploadifyUSJIXY”><div><input name=”wz_logo” type=”hidden” value=”‘+response+’” /><a href=”‘+response+’” target=”_blank”>查看图片</a></div><span>’+response+’ (105.42KB)</span><span> – 100%</span><div><div id=”uploadifyUSJIXYProgressBar” style=”width: 100%;”></div></div></div>’);

}

});

//多文件上传处理

$(document).ready(function(){

$(“#uploadify”).uploadify({

’uploader’ : ‘/Public/uploadify/uploadify.swf’,

’script’ : ‘/Public/uploadify/uploadify.php’,

’cancelImg’ : ‘/Public/uploadify/cancel.png’,

’folder’ : ‘/Public/pictures/news/<?php echo date(“Ymd”,strtotime(“now”))?>/’,

’queueID’ : ‘fileQueue’,

’fileExt’ : ‘*.jpg;*.gif;*.bmp;*.png’, //允许文件上传类型,和fileDesc一起使用.

’fileDesc’ : ‘*.jpg;*.gif;*.bmp;*.png’, //将不允许文件类型,不在浏览对话框的出现.

‘removeCompleted’ : true,

‘sizeLimit’ : 102400,

‘queueSizeLimit’ : 1,

‘simUploadLimit’ : 1,

’onComplete’:function(event,queueId,fileObj,response,data){

$.post(“__URL__/newsdowns/action/fileQueue”,{rpurl:response,wz:’pictures/’,table:’a_news’,operation:’eds’,field:’pictures’},function(result){});

$(‘#fileQueue’).html( ‘<div id=”uploadifyUSJIXY”><div><input name=”pictures” type=”hidden” value=”‘+response+’” /><a href=”‘+response+’” target=”_blank”>查看图片</a></div><span>’+response+’ (105.42KB)</span><span> – 100%</span><div><div id=”uploadifyUSJIXYProgressBar” style=”width: 100%;”></div></div></div>’);

}

});

html模版代码

<tr>

<div>

<tr>

</td>

</tr>

</table>

</div>

</td>

</td>

</tr>

</table>

</div>

说明：

uploader ： uploadify.swf 文件的相对路径，该swf文件是一个带有文字BROWSE的按钮，点击后淡出打开文件对话框，默认值：uploadify.swf。

script ：后台处理程序的相对路径。默认值：uploadify.php

checkScript ：用来判断上传选择的文件在服务器是否存在的后台处理程序的相对路径

fileDataName ：设置一个名字，在服务器处理程序中根据该名字来取上传文件的数据。默认为Filedata

method ：提交方式Post 或Get 默认为Post

scriptAccess ：flash脚本文件的访问模式，如果在本地测试设置为always，默认值：sameDomain

folder ： 上传文件存放的目录。

queueID ： 文件队列的ID，该ID与存放文件队列的div的ID一致。

queueSizeLimit ： 当允许多文件生成时，设置选择文件的个数，默认值：999 。

multi ： 设置为true时可以上传多个文件。

auto ： 设置为true当选择文件后就直接上传了，为false需要点击上传按钮才上传。

fileDesc ： 这个属性值必须设置fileExt属性后才有效，用来设置选择文件对话框中的提示文本，如设置fileDesc为“请选择rar doc pdf文件”，

fileExt ： 设置可以选择的文件的类型，格式如：’*.doc;*.pdf;*.rar’ 。

sizeLimit ： 上传文件的大小限制。

simUploadLimit ： 允许同时上传的个数默认值：1 。

buttonText ： 浏览按钮的文本，默认值：BROWSE 。

buttonImg ： 浏览按钮的图片的路径。

hideButton ： 设置为true则隐藏浏览按钮的图片。

rollover ： 值为true和false，设置为true时当鼠标移到浏览按钮上时有反转效果。

width ： 设置浏览按钮的宽度，默认值：110。

height ： 设置浏览按钮的高度，默认值：30。

wmode ： 设置该项为transparent 可以使浏览按钮的flash背景文件透明，并且flash文件会被置为页面的最高层。默认值：opaque 。

cancelImg ：选择文件到文件队列中后的每一个文件上的关闭按钮图标，

onInit : 做一些初始化的工作。
onSelect ：选择文件时触发，该函数有三个参数

event:事件对象。

queueID：文件的唯一标识，由6为随机字符组成。

fileObj：选择的文件对象，有name、size、creationDate、modificationDate、type 5个属性。

onSelectOnce ：在单文件或多文件上传时，选择文件时触发。该函数有两个参数event，data，data对象有以下几个属性：

fileCount：选择文件的总数。

filesSelected：同时选择文件的个数，如果一次选择了3个文件该属性值为3。

filesReplaced：如果文件队列中已经存在A和B两个文件，再次选择文件时又选择了A和B，该属性值为2。

allBytesTotal：所有选择的文件的总大小。

onCancel : 当点击文件队列中文件的关闭按钮或点击取消上传时触发。该函数有event、queueId、fileObj、data四个参数，前三个参数同onSelect 中的三个参数，data对象有两个属性fileCount和allBytesTotal。

fileCount：取消一个文件后，文件队列中剩余文件的个数。

allBytesTotal：取消一个文件后，文件队列中剩余文件的大小。

onClearQueue ：当调用函数fileUploadClearQueue时触发。有event和data两个参数，同onCancel 中的两个对应参数。

onQueueFull ：当设置了queueSizeLimit并且选择的文件个数超出了queueSizeLimit的值时触发。该函数有两个参数event和queueSizeLimit。

onError ：当上传过程中发生错误时触发。该函数有event、queueId、fileObj、errorObj四个参数，其中前三个参数同上，errorObj对象有type和info两个属性。

type：错误的类型，有三种‘HTTP’, ‘IO’, or ‘Security’

info：错误的描述

onOpen ：点击上传时触发，如果auto设置为true则是选择文件时触发，如果有多个文件上传则遍历整个文件队列。该函数有event、queueId、fileObj三个参数，参数的解释同上。

onProgress ：点击上传时触发，如果auto设置为true则是选择文件时触发，如果有多个文件上传则遍历整个文件队列，在onOpen之后触发。该函数有 event、queueId、fileObj、data四个参数，前三个参数的解释同上。data对象有四个属性percentage、 bytesLoaded、allBytesLoaded、speed：