Question

我希望将fineuploader集成到我的JQuery Mobile应用程序中。作为起点，我尝试使用提供的on fineuploader.com默认模板来熟悉自己。

我从github.下载了最新的fineuploader副本我已经通过猜测给出了.js文件的来源，因为我找不到要使用fineuploader jquery插件引用哪些文件的明确文档。

默认模板不起作用，我相信我没有引用相应的文件？有人可以告诉我可能做错了吗？

以下是我使用的默认模板from fineuploader.com。

<!DOCTYPE html>

<html>
  <head>

      <link href="fine-uploader-master/client/fineuploader.css" rel="stylesheet"/>

  </head>
  <body>

    <!-- The element where Fine Uploader will exist. -->
    <div id="fine-uploader">
    </div>

    <!-- jQuery version 1.10.x (if you are using the jQuery plugin -->
    <script src="http://code.jquery.com/jquery-1.10.2.min.js" type="text/javascript"></script>

    <!-- Fine Uploader-jQuery -->
    <script src="fine-uploader-master/client/js/jquery-plugin.js" type="text/javascript"></script>
    <script src="fine-uploader-master/client/js/uploader.js" type="text/javascript"></script>
    <script>
    // Wait until the DOM is 'ready'
    $(document).ready(function () {
        $("#fine-uploader").fineUploader({
            debug: true,
            request: {
                endpoint: '/uploads'
            },
            deleteFile: {
                enabled: true,
                endpoint: '/uploads'
            },
            retry: {
               enableAuto: true
            }
        });
    });
    </script>

    <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>
            <ul class="qq-upload-list-selector qq-upload-list">
                <li>
                  <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>
                </li>
            </ul>
        </div>
    </script>

  </body>
</html>

Answer 1

我同意Ray上面的评论，你不应该引用单个文件。

您可以购买许可证并下载其打包版本。http://fineuploader.com/purchase_form.html

或者，这是我用来在Windows系统上从git存储库构建FineUploader的命令。这是您在上面提供的“构建您自己的”链接中找到的内容的更详细说明。我相信这会从存储库中提取最新代码，如果你想要一个旧版本，你必须对git clone调用进行一些调查，因为我对它不是很熟悉。

安装nodejs：http://nodejs.org/download/
安装git：http://git-scm.com/download/win（确保在安装过程中选择“从命令提示符运行Git”，以便将其添加到环境路径中。
打开NodeJs命令提示符
全局安装Grunt-cli（-g）：
- npm install –g grunt-cli
使用Git将最新的源代码拉入目录
- 将CD放入您希望将存储库拉入的源目录（例如cd c:\source）
- 运行git clone git://github.com/Widen/fine-uploader
- 这将创建一个“精细上传”目录，其中包含最新的源文件
CD进入精细上传目录
~~运行以下命令以安装所需的软件包（将这些软件包复制到批处理文件中以使其更容易...）。注意：随着项目未来的发展，可能还需要其他软件包。~~运行以下命令以安装所需的软件包。
- npm install
运行grunt package以构建打包的js和css文件。

最后一个命令将必要的文件组合在一起并将它们放入“_dist”目录中。 “_dist”目录包含程序的每种风格的文件夹和zip文件（all，jquery，s3等）。一个更详细的包（即jquery vs core）将是更大的文件，所以只能使用你需要的。

如何使用fineuploader

1 个答案: