首页 > Web开发 > 详细

Web文件上传模块 Plupload

时间:2015-04-23 15:19:00      阅读:272      评论:0      收藏:0      [点我收藏+]

Plupload 是一个Web浏览器上的界面友好的文件上传模块,可显示上传进度、图像自动缩略和上传分块。可同时上传多个文件。

 

示例代码:

 

<!-- Load Queue widget CSS and jQuery -->
<style type="text/css">@import url(css/plupload.queue.css);</style>
<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript">
    google.load("jquery", "1.3");
</script>
 
<!-- Thirdparty intialization scripts, needed for the Google Gears and BrowserPlus runtimes -->
<script type="text/javascript" src="/plupload/js/gears_init.js"></script>
<script type="text/javascript" src="http://bp.yahooapis.com/2.4.21/browserplus-min.js"></script>
 
<!-- Load plupload and all it‘s runtimes and finally the jQuery queue widget -->
<script type="text/javascript" src="/plupload/js/plupload.full.min.js"></script>
<script type="text/javascript" src="/plupload/js/jquery.plupload.queue.min.js"></script>
 
<script type="text/javascript">
// Convert divs to queue widgets when the DOM is ready
$().ready(function() {
    $("#uploader").pluploadQueue({
        // General settings
        runtimes : ‘gears,flash,silverlight,browserplus,html5‘,
        url : ‘upload.php‘,
        max_file_size : ‘10mb‘,
        chunk_size : ‘1mb‘,
        unique_names : true,
 
        // Resize images on clientside if we can
        resize : {width : 320, height : 240, quality : 90},
 
        // Specify what files to browse for
        filters : [
            {title : "Image files", extensions : "jpg,gif,png"},
            {title : "Zip files", extensions : "zip"}
        ],
 
        // Flash settings
        flash_swf_url : ‘/plupload/js/plupload.flash.swf‘,
 
        // Silverlight settings
        silverlight_xap_url : ‘/plupload/js/plupload.silverlight.xap‘
    });
 
    // Client side form validation
    $(‘form‘).submit(function(e) {
        var uploader = $(‘#uploader‘).pluploadQueue();
 
        // Validate number of uploaded files
        if (uploader.total.uploaded == 0) {
            // Files in queue upload them first
            if (uploader.files.length > 0) {
                // When all files are uploaded submit form
                uploader.bind(‘UploadProgress‘, function() {
                    if (uploader.total.uploaded == uploader.files.length)
                        $(‘form‘).submit();
                });
 
                uploader.start();
            } else
                alert(‘You must at least upload one file.‘);
 
            e.preventDefault();
        }
    });
});
</script>
 
...
 
<form ..>
    <div id="uploader">
        <p>You browser doesn‘t have Flash, Silverlight, Gears, BrowserPlus or HTML5 support.</p>
    </div>
</form>

Web文件上传模块 Plupload

原文:http://www.cnblogs.com/zhaojielang/p/4450501.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!