与 jQuery 一起使用的 Javascript 模板引擎答案

【问题标题】：Javascript Template Engine Use with jQuery与 jQuery 一起使用的 Javascript 模板引擎
【发布时间】：2012-03-01 16:39:37
【问题描述】：

所有，我正在尝试使用 jQuery File Upload Demo： http://blueimp.github.com/jQuery-File-Upload/

我的问题是它在文档中说它使用 Javascript 模板引擎 (https://github.com/blueimp/jQuery-File-Upload/wiki/Template-Engine)

但是，我不熟悉这个过程。我正在尝试将其集成到我的 Wordpress 博客中，以允许以这种方式上传文件。在 index.html 中定义了以下模板：

<script id="template-upload" type="text/x-tmpl">
{% for (var i=0, file; file=o.files[i]; i++) { %}
    <tr class="template-upload fade">
        <td class="preview"><span class="fade"></span></td>
        <td class="name">{%=file.name%}</td>
        <td class="size">{%=o.formatFileSize(file.size)%}</td>
        {% if (file.error) { %}
            <td class="error" colspan="2"><span class="label label-important">{%=locale.fileupload.error%}</span> {%=locale.fileupload.errors[file.error] || file.error%}</td>
        {% } else if (o.files.valid && !i) { %}
            <td>
                <div class="progress progress-success progress-striped active"><div class="bar" style="width:0%;"></div></div>
            </td>
            <td class="start">{% if (!o.options.autoUpload) { %}
                <button class="btn btn-primary">
                    <i class="icon-upload icon-white"></i> {%=locale.fileupload.start%}
                </button>
            {% } %}</td>
        {% } else { %}
            <td colspan="2"></td>
        {% } %}
        <td class="cancel">{% if (!i) { %}
            <button class="btn btn-warning">
                <i class="icon-ban-circle icon-white"></i> {%=locale.fileupload.cancel%}
            </button>
        {% } %}</td>
    </tr>
{% } %}
</script>

我正在使用 jQuery Tmpl 代码 (https://github.com/jquery/jquery-tmpl)，当我尝试在我的 Wordpress 博客中创建此代码时，我的 jquery.fileupload-ui.js 文件中的这些行出现了一些错误：

_initTemplates: function () {
        var options = this.options;
        options.templateContainer = document.createElement(
            this._files.prop('nodeName')
        );
        options.uploadTemplate = tmpl(options.uploadTemplateId);
        options.downloadTemplate = tmpl(options.downloadTemplateId);
    },

在此文件的前面，这被定义为：uploadTemplateId: 'template-upload',

我很困惑为什么这不起作用，甚至不知道如何使用我自己的 javascript 模板来做到这一点？当我尝试将这些文件复制到我的 Wordpress 博客中时，它总是失败，我认为我唯一没有复制的是 package.JSON 和初始下载中的 .gitignore 文件。这些文件有什么意义？只是想了解这个模板是什么以及如何使用它？

非常感谢您提前指出我的任何内容！感谢您的帮助！

【问题讨论】：

标签： javascript jquery template-engine

【解决方案1】：

.gitignore 是一个源代码控制文件，与脚本无关 - 请参阅 http://help.github.com/ignore-files/ 了解更多信息。

package.JSON 是 jquery 插件的元数据文件，供新的 jquery 插件站点使用，与您尝试使用的插件的功能无关 - 请参阅 https://github.com/jquery/plugins.jquery.com#readme 了解更多信息。

我对该错误的最佳猜测是插件与您在 wordpress 上已有的脚本文件之间存在冲突。

您能否发布实际的错误消息？

【讨论】：