baidu_31118981
张仲景的小柴胡
2016-04-08 07:18

Html Webuploader 拖拽上传没有效果

  • html5
  • editplus

<!doctype html>







Document
<link rel="stylesheet" type="text/css" href="D:/web/webuploader/webuploader.css" />

<link rel="stylesheet" type="text/css" href="D:/web/webuploader/uploadstyle.css" />

<script type="text/javascript" src="D:/web/webuploader/upjquery.js"></script>

<script type="text/javascript" src="D:/web/webuploader/webuploader.js"></script>

<script type="text/javascript" src="D:/web/webuploader/upload.js"></script>


uploader = WebUploader.create({ auto: true, // swf文件路径 swf:'D:\web\webuploader\Uploader.swf', // 文件接收服务端。 server: 'http://webuploader.duapp.com/server/fileupload.php', // 选择文件的按钮。可选。 // 内部根据当前运行是创建,可能是input元素,也可能是flash. pick: '#filePicker', // 只允许选择图片文件。 accept: { title: 'Images', extensions: 'gif,jpg,jpeg,bmp,png', mimeTypes: 'image/*' } }); // 当有文件添加进来的时候 uploader.on( 'fileQueued', function( file ) { var $li = $( '<div id="' + file.id + '" class="file-item thumbnail">' + '<img>' + '<div class="info">' + file.name + '</div>' + '</div>' ), $img = $li.find('img'); // $list为容器jQuery实例 $list.append( $li ); // 创建缩略图 // 如果为非图片文件,可以不用调用此方法。 // thumbnailWidth x thumbnailHeight 为 100 x 100 uploader.makeThumb( file, function( error, src ) { if ( error ) { $img.replaceWith('<span>不能预览</span>'); return; } $img.attr( 'src', src ); }, thumbnailWidth, thumbnailHeight ); });
                    <p>或将照片拖到这里,单次最多可选9张,单个文件大小不超过2M</p>

                </div>

            </div>

            <div class="statusBar" style="display:none;">

                <div class="progress">

                    <span class="text">0%</span>

                    <span class="percentage"></span>

                </div><div class="info"></div>

                <div class="btns">

                    <div id="filePicker2"></div><div class="uploadBtn">发表</div>

                </div>

            </div>

        </div>

        </div>

  • 点赞
  • 回答
  • 收藏
  • 复制链接分享

1条回答