webuploader上传图片控件

最新推荐文章于 2019-10-11 16:34:42 发布

JimmyWork

最新推荐文章于 2019-10-11 16:34:42 发布

阅读量332

点赞数

分类专栏：基础知识

基础知识专栏收录该内容

16 篇文章 0 订阅

订阅专栏

JSP片段：

<!-- 上传附件 2019-02-26-->
	<link rel="stylesheet" type="text/css" href="plugins/webuploader/webuploader.css" />
	<link rel="stylesheet" type="text/css" href="plugins/webuploader/style.css" />



<tr>
    <td style="width:75px;text-align: right;padding-top: 13px;">图片:</td>
<td>
    <div class="col-sm-10">
        <input type="text" name="PIC" id="PIC" value="${pd.PIC}">
        <div id="thumb" class="webUploader col-xs-12 col-sm-12 col-md-6 col-lg-4">
        <div class="queueList" style="margin:0;margin-bottom:20px;">
        <div class="dndArea placeholder" style="padding-top:90px;background-position-y:23px;">
        <div class="filePicker"></div>
        <p>或将图片拖到这里，只可上传一个图片</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 class="filePicker2"></div><div class="uploadBtn">开始上传</div>
            </div>
        </div>
    </div>	
    </div>
</td>
</tr>



<!-- webuploader上传插件 -->
	<script type="text/javascript" src="plugins/webuploader/webuploader.js"></script>
	<script type="text/javascript" src="plugins/webuploader/upload.js"></script>

参考官网：http://fex.baidu.com/webuploader/getting-started.html