Question

例如，我有这个初始化代码

<div class="form-group">
    <label class="col-sm-4" for="fine-uploader">Upload</label>
    <div class="col-sm-8" id="fine-uploader">
        <div id="select-files"></div>
        <table>
            <tbody id="list-files">

            </tbody>
        </table>
    </div>
</div>

好的，我有

#fine-uploader我在哪里初次上传
#select-files我在哪里上传btn
#list-files将放置上传文件

好的，去吧

$(function(){
    var fine_uploader = $("#fine-uploader");

    var keyword_upload = fine_uploader.find("#select-files").fineUploader({
        listElement: fine_uploader.find('#list-files'),
        debug: true,
        request: {
            endpoint: '/fineuploader',
        },
    });
});

这个模板

<script type="text/template" id="qq-template">
  <div class="qq-uploader-selector qq-uploader">
    <div class="qq-upload-drop-area-selector qq-upload-drop-area" qq-hide-dropzone>
      <span>Drop files here to upload</span>
    </div>
    <div class="qq-upload-button-selector qq-upload-button">
      <div>Upload a file</div>
    </div>
    <span class="qq-drop-processing-selector qq-drop-processing">
      <span>Processing dropped files...</span>
      <span class="qq-drop-processing-spinner-selector qq-drop-processing-spinner"></span>
    </span>
    <span class="qq-upload-list-selector qq-upload-list">
      <tr>
      <td>
        <div class="qq-progress-bar-container-selector">
          <div class="qq-progress-bar-selector qq-progress-bar"></div>
        </div>
        <span class="qq-upload-spinner-selector qq-upload-spinner"></span>
        <span class="qq-edit-filename-icon-selector qq-edit-filename-icon"></span>
        <span class="qq-upload-file-selector qq-upload-file"></span>
        <input class="qq-edit-filename-selector qq-edit-filename" tabindex="0" type="text">
        <span class="qq-upload-size-selector qq-upload-size"></span>
        <a class="qq-upload-cancel-selector qq-upload-cancel" href="#">Cancel</a>
        <a class="qq-upload-retry-selector qq-upload-retry" href="#">Retry</a>
        <a class="qq-upload-delete-selector qq-upload-delete" href="#">Delete</a>
        <span class="qq-upload-status-text-selector qq-upload-status-text"></span>
      </td>
    </tr>
    </span>
  </div>
</script>

虽然这段代码什么都没输出？..只有一个upload按钮..

如何在表格中创建文件列表输出？感谢。

Answer 1

您的HTML表格无效。一般来说，如果你想要一个表格布局，你应该适当地使用CSS设置模板/ HTML（显示：表格等），而不是使用<table>。 Fine Uploader内部的模板代码可能无法与传统的HTML表格元素一起使用。

如果表格元素最适合您的情况或需要特定原因，请在the GitHub issue you opened in the project's repo中讨论。

fine-uploader - 如何使用表作为文件列表？

1 个答案: