未捕获错误：无法在 ID 'qq-template' 处找到模板脚本！

Question

我刚刚下载了 Fine Uploader 4.0 的新“自定义版本”。我的页面在几周前安装和设置的 3.9 上运行良好。

我的代码：

Click "Select Files" and pick the files you would like to upload.  Then click "Upload Now" to start the transfer.
<hr>
<div id="fineuploader-s3"></div>
<div id="triggerUpload" class="btn btn-primary" style="margin-top: 10px;">
    <i class="icon-upload icon-white"></i> Upload now
</div>

    <script src="http://code.jquery.com/jquery-latest.js"></script>
    <script src="http://xxxxxxx/fineuploader-4.0.3/custom.fineuploader-4.0.3.js"></script>
    <script>


      $(document).ready(function () {

          var manualuploader;

          function check_done() {
              if (allUploadsCompleted() === true) {
                  var successUrl = "http://xxxxxxxx/FineUploadComplete?ftpSessionId=xxxxxx";
                  $.get( successUrl );
                  alert('Your upload is complete.');
                  window.top.location = "xxxxxxxx";
              } 
           }

           function allUploadsCompleted() {
               // If and only if all of Fine Uploader's uploads are in a state of completion will this function fire the provided callback.
               var inProgress = manualuploader.fineUploader('getInProgress');
               if (inProgress === 0) {
                   var failedUploads = manualuploader.fineUploader('getUploads', { status: qq.status.UPLOAD_FAILED });
                   if (failedUploads.length === 0) {
                       return true;
                   }
                }        
                return false;
            }


            manualuploader = $('#fineuploader-s3').fineUploaderS3({
                debug: true,
            autoUpload: false,
                editFilename: {
                enabled: true
            },
            element: $('#fineuploader-s3')[0],
            text: {
                uploadButton: '<i class="icon-plus icon-white"></i> Select Files'
                },
                cors: {
                       expected: true,
                       sendCredentials: true
                },
                request: {
                    endpoint: "xxxxx",
                    accessKey: "xxxx"
                },
                signature: {
                    endpoint: "http://xxxxxx/S3UploadSig"
                },
        objectProperties: {
                key:  function (fileId) { return "xxxx" + '/' + $("#fineuploader-s3").fineUploader("getName",fileId); } 
            },
                retry: {
                        showButton: true
                },
                chunking: {
                        enabled: true
                },
                resume: {
                        enabled: true
                },
                deleteFile: {
                        enabled: false
                },
                callbacks: {
                    onStatusChange: function (id, oldStatus, newStatus) {
                        // This will check to see if a file that has been cancelled
                        // would equate to all uploads being 'completed'.
                        if (newStatus === qq.status.CANCELLED) {
                            check_done();
                        }     
                    },
                    onComplete: check_done
                },
                validation: {
            allowedExtensions: [xxxxxx]
                }
          });

    $('#triggerUpload').click(function() {
            manualuploader.fineUploader('uploadStoredFiles');
        });

      });
    </script>

我在 java 控制台中收到以下错误...

未捕获错误：无法在 ID 'qq-template' 处找到模板脚本！

@custom.fineuploader-4.0.3.js:4915

那么我该如何解决这个错误，是否还需要进行其他更改才能在 4.0 上工作？

谢谢，J

Answer 1

Fine Uploader 4.0 在模板方面带来了很大的改进。这需要进行重大更改，因此主版本号会增加。

简而言之，template和fileTemplate选项已从 JavaScript 文件中移出。您现在必须在文档/标记中定义模板。这有很多优点。最重要的是，这使得自定义 Fine Uploader UI 模板变得更加直观。构建时提供了默认模板。您可以在样式指南中阅读有关模板的更多信息，以及“升级到 4.x”指南中 4.0 中的所有其他重大更改。

请注意，该fileTemplate选项已被删除。默认情况下，该template选项现在指向包含模板的元素。默认情况下，它期望该元素的 ID 为“qq-template”。您可以覆盖它并传递实际元素或不同的 ID。您的模板通常包含在带有<script>“type文本/模板”的标签中，但这不是必需的。