2

我刚刚为 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

4

2 回答 2

4

Fine Uploader 4.0 brought about a big improvement in templating. This required breaking changes, thus the major version number was incremented.

In short, the template and fileTemplate options were moved out of the JavaScript file. You must now define your template in your document/markup. This has a number of advantages. The biggest being that this makes it much more intuitive to customize the Fine Uploader UI template. Default templates are provided with the build. You can read more about templating in the styling guide, along with all other breaking changes in 4.0 in the "Upgrading to 4.x" guide.

Note that the fileTemplate option was removed. The template option now, by default, points to an element that contains your template. By default, it expects this element to have an ID of "qq-template". You can override this and pass an actual element or a different ID. It's common for your template to be contained in a <script> tag w/ a type of "text/template", but this is not required.

于 2013-11-07T21:39:55.063 回答
-2

如文档中所述，您应该在页面中使用这样的代码：

https://pastebin.com/raw/QCxYp0t3

ps 但是，我看到了一些回归（与上面的答案相反），因为我们必须手动放置那些大模板代码/块，而不仅仅是动态嵌入.js文件（如 jQuery-UI 或其他臭名昭著的库做）。

至少，开发人员应该为他们保留这个功能，谁想要那个。

于 2017-12-20T16:01:26.850 回答