基本上,我使用的jQuery插件是:http://fineuploader.com/
上传器模板的HTML模型如下所示
<div class="span9">
<h2>Upload file</h2>
<div id="bootstrapped-fine-uploader">
<noscript>
<p>Please enable JavaScript to use file uploader.</p>
</noscript>
</div>
</div>
<div class="span9" style="padding-top:50px;">
<table class="table table-bordered table-condensed">
<thead>
<tr>
<th>Filename</th>
<th>Filesize</th>
<th>Status</th>
</tr>
</thead>
<tbody>
<tr>
<td colspan="3">No active uploads</td>
</tr>
</tbody>
</table>
</div>
我想要做的是将文件列表添加到一个独立的表行中,而不是默认的(这是某种警告),它们用于此的模型是
template: '<div class="qq-uploader">' +
((!this._options.dragAndDrop || !this._options.dragAndDrop.disableDefaultDropzone) ? '<div class="qq-upload-drop-area"><span>{dragZoneText}</span></div>' : '') +
(!this._options.button ? '<div class="qq-upload-button"><div>{uploadButtonText}</div></div>' : '') +
'<span class="qq-drop-processing"><span>{dropProcessingText}</span><span class="qq-drop-processing-spinner"></span></span>' +
(!this._options.listElement ? '<ul class="qq-upload-list"></ul>' : '') +
'</div>',
// template for one item in file list
fileTemplate: '<li>' +
'<div class="qq-progress-bar"></div>' +
'<span class="qq-upload-spinner"></span>' +
'<span class="qq-upload-finished"></span>' +
'<span class="qq-upload-file"></span>' +
'<span class="qq-upload-size"></span>' +
'<a class="qq-upload-cancel" href="#">{cancelButtonText}</a>' +
'<a class="qq-upload-retry" href="#">{retryButtonText}</a>' +
'<a class="qq-upload-delete" href="#">{deleteButtonText}</a>' +
'<span class="qq-upload-status-text">{statusText}</span>' +
'</li>',
实际上,我不知道他们如何称呼这个函数,尽管如果在这个应用程序中有经验的人能为我指明如何实现我的请求的正确方向,我将非常感激。
发布于 2013-04-02 13:23:46
您将希望使用所需的标记提供fileTemplate
选项的替代版本。您还需要将listElement
选项设置为指向文件项的容器。当前,文件列表是无序列表中包含的一组列表项。您需要将listElement
设置为您的<tbody>
,每个文件项(由fileTemplate
选项表示)都是<tr>
。
FineUploader模式下的上传器样式在造型精巧Uploader文档中有更多描述。另一种选择是使用FineUploaderBasic模式,它仍然为您处理跨浏览器上传,但允许您轻松定义自己的UI。
https://stackoverflow.com/questions/15757120
复制相似问题