| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354 |
- <!DOCTYPE html>
- <html xmlns="http://www.w3.org/1999/xhtml" dir="ltr">
- <head>
- <meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
- <title>jQuery多文件上传插件 Plupload</title>
- <script type="text/javascript" src="https://code.jquery.com/jquery-1.11.3.js"></script>
- <script type="text/javascript" src="https://blueimp.github.io/JavaScript-MD5/js/md5.js"></script>
- <script src="{{rootUrl}}global/js/sha1.js"></script>
- <script type="text/javascript" src="{{rootUrl}}global/js/videoupload.js"></script>
- </head>
- <body>
- <p>UpLoad: <input type="file" name="file" id="inputid"/></p>
- <p>UpLoad: <input type="button" name="uploadid" id="uploadid" value="shangchuang"/></p>
- <script>
- $(function(){
- var opt = {
- fileInputId: 'inputid',
- fileUploadId: 'uploadid'
- };
- Uploader(opt).init();
- })
- </script>
- </body>
- </html>
- <!--<!DOCTYPE html>-->
- <!--<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr">-->
- <!--<head>-->
- <!--<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>-->
- <!--<title>jQuery多文件上传插件 Plupload</title>-->
- <!--</head>-->
- <!--<body>-->
- <!--<form action="/upload4" enctype="multipart/form-data" method="post">-->
- <!--<p>UpLoad: <input type="text" name="name" /></p>-->
- <!--<p>UpLoad: <input type="file" name="file" /></p>-->
- <!--<input type="submit" value="Submit" />-->
- <!--</form>-->
- <!--</body>-->
- <!--</html>-->
- <!--<!DOCTYPE html>-->
- <!--<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr">-->
- <!--<head>-->
- <!--<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>-->
- <!--<title>jQuery多文件上传插件 Plupload</title>-->
- <!--<link type="text/css" rel="stylesheet" href="{{rootUrl}}global/jquery-ui/jquery-ui.min.css" media="screen" />-->
- <!--<link type="text/css" rel="stylesheet" href="{{rootUrl}}global/js/jquery.ui.plupload/css/jquery.ui.plupload.css" media="screen" />-->
- <!--<style>-->
- <!--body{background:#fff;}-->
- <!--#uploader{max-width:800px;margin:50px auto;}-->
- <!--</style>-->
- <!--<!–[if lte IE 7]>-->
- <!--<style>-->
- <!--#main-menu {-->
- <!--position: absolute;-->
- <!--position: fixed;-->
- <!--}-->
- <!--.menu-item {-->
- <!--float: left;-->
- <!--}-->
- <!--.span4 {-->
- <!--float: left;-->
- <!--}-->
- <!--.clearfix {-->
- <!--clear: both;-->
- <!--}-->
- <!--.btn {-->
- <!--zoom: 1;-->
- <!--}-->
- <!--</style>-->
- <!--<![endif]–>-->
- <!--<!–[if lt IE 9]>-->
- <!--<script src="{{rootUrl}}global/js/html5shiv.js"></script>-->
- <!--<![endif]–>-->
- <!--</head>-->
- <!--<body>-->
- <!--<div id="uploader">-->
- <!--<p>Your browser doesn't have Flash, Silverlight or HTML5 support.</p>-->
- <!--</div>-->
- <!--<script type="text/javascript" src="{{rootUrl}}global/js/jquery-1.9.1.min.js" charset="UTF-8"></script>-->
- <!--<script type="text/javascript" src="{{rootUrl}}global/jquery-ui/jquery-ui.min.js" charset="UTF-8"></script>-->
- <!--<script type="text/javascript" src="{{rootUrl}}global/js/plupload.full.min.js" charset="UTF-8"></script>-->
- <!--<script type="text/javascript" src="{{rootUrl}}global/js/jquery.ui.plupload/jquery.ui.plupload.min.js" charset="UTF-8"></script>-->
- <!--<script type="text/javascript" src="{{rootUrl}}global/js/i18n/zh_CN.js" charset="UTF-8"></script>-->
- <!--<script type="text/javascript">-->
- <!--$(function() {-->
- <!--$("#uploader").plupload({-->
- <!--// General settings-->
- <!--runtimes : 'html5,flash,silverlight,html4',-->
- <!--url : '/upload3',-->
- <!--// max_file_size : '2mb',//最大文件大小-->
- <!--max_file_count: 20,//最大文件数量-->
- <!--chunk_size: '3mb',-->
- <!--// Resize images on clientside if we can-->
- <!--// resize : {-->
- <!--// width : 200,-->
- <!--// height : 200,-->
- <!--// quality : 90,-->
- <!--// crop: true // crop to exact dimensions-->
- <!--// },-->
- <!--// Specify what files to browse for-->
- <!--filters : [-->
- <!--// {title : "图片文件", extensions : "jpg,gif,png"},-->
- <!--// {title : "压缩文件", extensions : "zip,rar"},-->
- <!--{title : "视频文件", extensions : "Avi,MP4"}-->
- <!--],-->
- <!--// Rename files by clicking on their titles-->
- <!--rename: true,-->
- <!--// Sort files-->
- <!--sortable: true,-->
- <!--// Enable ability to drag'n'drop files onto the widget (currently only HTML5 supports that)-->
- <!--dragdrop: true,-->
- <!--// Views to activate-->
- <!--// views: {-->
- <!--// list: true,-->
- <!--// thumbs: true, // Show thumbs-->
- <!--// active: 'thumbs'-->
- <!--// },-->
- <!--// Flash settings-->
- <!--flash_swf_url : '{{rootUrl}}global/js/Moxie.swf',-->
- <!--// Silverlight settings-->
- <!--silverlight_xap_url : '{{rootUrl}}global/js/Moxie.xap'-->
- <!--});-->
- <!--});-->
- <!--</script>-->
- <!--</body>-->
- <!--</html>-->
- <!--<!DOCTYPE html>-->
- <!--<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr">-->
- <!--<head>-->
- <!--<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>-->
- <!--<title>Plupload - Events example</title>-->
- <!--<!– production –>-->
- <!--<script type="text/javascript" src="{{rootUrl}}global/js/plupload.full.min.js"></script>-->
- <!--<!– debug-->
- <!--<script type="text/javascript" src="{{rootUrl}}global/js/moxie.js"></script>-->
- <!--<script type="text/javascript" src="{{rootUrl}}global/js/plupload.dev.js"></script>-->
- <!--–>-->
- <!--</head>-->
- <!--<body style="font: 13px Verdana; background: #eee; color: #333">-->
- <!--<h1>Events example</h1>-->
- <!--<div id="container">-->
- <!--<a id="pickfiles" href="javascript:;">[Select files]</a>-->
- <!--<a id="uploadfiles" href="javascript:;">[Upload files]</a>-->
- <!--</div>-->
- <!--<br />-->
- <!--<pre id="console"></pre>-->
- <!-- -->
- <!--<script type="text/javascript">-->
- <!--var uploader = new plupload.Uploader({-->
- <!--// General settings-->
- <!--runtimes : 'html5',-->
- <!--browse_button : 'pickfiles', // you can pass in id...-->
- <!--url : '/upload3',-->
- <!--// multipart: false,-->
- <!--chunk_size : '3mb',-->
- <!--unique_names : true,-->
- <!--// Resize images on client-side if we can-->
- <!--// resize : { width : 320, height : 240, quality : 90 },-->
- <!--filters : {-->
- <!--// max_file_size : '10mb',-->
- <!--// Specify what files to browse for-->
- <!--mime_types: [-->
- <!--// {title : "Image files", extensions : "jpg,gif,png"},-->
- <!--// {title : "Zip files", extensions : "zip"},-->
- <!--{title : "Video files", extensions : "mp4,avi,flv,rmvb"}-->
- <!--],-->
- <!--prevent_duplicates : true-->
- <!--},-->
- <!--flash_swf_url : '{{rootUrl}}global/js/Moxie.swf',-->
- <!--silverlight_xap_url : '{{rootUrl}}global/js/Moxie.xap',-->
- <!--// PreInit events, bound before the internal events-->
- <!--preinit : {-->
- <!--Init: function(up, info) {-->
- <!--log('[Init]', 'Info:', info, 'Features:', up.features);-->
- <!--},-->
- <!--UploadFile: function(up, file) {-->
- <!--log('[UploadFile]', file);-->
- <!--// You can override settings before the file is uploaded-->
- <!--// up.setOption('url', 'upload.php?id=' + file.id);-->
- <!--// up.setOption('multipart_params', {param1 : 'value1', param2 : 'value2'});-->
- <!--}-->
- <!--},-->
- <!--// Post init events, bound after the internal events-->
- <!--init : {-->
- <!--PostInit: function() {-->
- <!--// Called after initialization is finished and internal event handlers bound-->
- <!--log('[PostInit]');-->
- <!--document.getElementById('uploadfiles').onclick = function() {-->
- <!--uploader.start();-->
- <!--return false;-->
- <!--};-->
- <!--},-->
- <!--Browse: function(up) {-->
- <!--// Called when file picker is clicked-->
- <!--log('[Browse]');-->
- <!--},-->
- <!--Refresh: function(up) {-->
- <!--// Called when the position or dimensions of the picker change-->
- <!--log('[Refresh]');-->
- <!--},-->
- <!--StateChanged: function(up) {-->
- <!--// Called when the state of the queue is changed-->
- <!--log('[StateChanged]', up.state == plupload.STARTED ? "STARTED" : "STOPPED");-->
- <!--},-->
- <!--QueueChanged: function(up) {-->
- <!--// Called when queue is changed by adding or removing files-->
- <!--log('[QueueChanged]');-->
- <!--},-->
- <!--OptionChanged: function(up, name, value, oldValue) {-->
- <!--// Called when one of the configuration options is changed-->
- <!--log('[OptionChanged]', 'Option Name: ', name, 'Value: ', value, 'Old Value: ', oldValue);-->
- <!--},-->
- <!--BeforeUpload: function(up, file) {-->
- <!--// Called right before the upload for a given file starts, can be used to cancel it if required-->
- <!--log('[BeforeUpload]', 'File: ', file);-->
- <!--},-->
- <!--UploadProgress: function(up, file) {-->
- <!--// Called while file is being uploaded-->
- <!--log('[UploadProgress]', 'File:', file, "Total:", up.total);-->
- <!--},-->
- <!--FileFiltered: function(up, file) {-->
- <!--// Called when file successfully files all the filters-->
- <!--log('[FileFiltered]', 'File:', file);-->
- <!--},-->
- <!--FilesAdded: function(up, files) {-->
- <!--// Called when files are added to queue-->
- <!--log('[FilesAdded]');-->
- <!--plupload.each(files, function(file) {-->
- <!--log(' File:', file);-->
- <!--});-->
- <!--},-->
- <!--FilesRemoved: function(up, files) {-->
- <!--// Called when files are removed from queue-->
- <!--log('[FilesRemoved]');-->
- <!--plupload.each(files, function(file) {-->
- <!--log(' File:', file);-->
- <!--});-->
- <!--},-->
- <!--FileUploaded: function(up, file, info) {-->
- <!--// Called when file has finished uploading-->
- <!--log('[FileUploaded] File:', file, "Info:", info);-->
- <!--},-->
- <!--ChunkUploaded: function(up, file, info) {-->
- <!--// Called when file chunk has finished uploading-->
- <!--log('[ChunkUploaded] File:', file, "Info:", info);-->
- <!--},-->
- <!--UploadComplete: function(up, files) {-->
- <!--// Called when all files are either uploaded or failed-->
- <!--log('[UploadComplete]');-->
- <!--},-->
- <!--Destroy: function(up) {-->
- <!--// Called when uploader is destroyed-->
- <!--log('[Destroy] ');-->
- <!--},-->
- <!--Error: function(up, args) {-->
- <!--// Called when error occurs-->
- <!--log('[Error] ', args);-->
- <!--}-->
- <!--}-->
- <!--});-->
- <!--function log() {-->
- <!--var str = "";-->
- <!--plupload.each(arguments, function(arg) {-->
- <!--var row = "";-->
- <!--if (typeof(arg) != "string") {-->
- <!--plupload.each(arg, function(value, key) {-->
- <!--// Convert items in File objects to human readable form-->
- <!--if (arg instanceof plupload.File) {-->
- <!--// Convert status to human readable-->
- <!--switch (value) {-->
- <!--case plupload.QUEUED:-->
- <!--value = 'QUEUED';-->
- <!--break;-->
- <!--case plupload.UPLOADING:-->
- <!--value = 'UPLOADING';-->
- <!--break;-->
- <!--case plupload.FAILED:-->
- <!--value = 'FAILED';-->
- <!--break;-->
- <!--case plupload.DONE:-->
- <!--value = 'DONE';-->
- <!--break;-->
- <!--}-->
- <!--}-->
- <!--if (typeof(value) != "function") {-->
- <!--row += (row ? ', ' : '') + key + '=' + value;-->
- <!--}-->
- <!--});-->
- <!--str += row + " ";-->
- <!--} else {-->
- <!--str += arg + " ";-->
- <!--}-->
- <!--});-->
- <!--var log = document.getElementById('console');-->
- <!--log.innerHTML += str + "\n";-->
- <!--}-->
- <!--uploader.init();-->
- <!--</script>-->
- <!--</body>-->
- <!--</html>-->
|