如何自定义Blueimp jQuery File Upload的上传/下载模板

bac*_*cao 12 javascript jquery template-engine

我正在尝试使用jQuery文件上传演示.我已经搜索了wiki和模板引擎wiki但是找不到如何在不使用表格行标签的情况下自定义上传/下载模板的答案.每次我删除/更改表行标记它都不起作用.

Bellow是我自定义的上传模板,它不起作用.我不知道为什么,有人可以帮忙吗?

uploadTemplate: function (o) {
        var rows = $();
        $.each(o.files, function (index, file) {
            var row = $('<li class="span3"><div class="thumbnail template-upload">' +
                '<div class="preview"><span></span></div>' +
                '<div class="caption"><h5 class="name"></h5>' +
                '<p class="size"></p>' +
                (file.error ? '<div class="error" colspan="2"></div>' :
                        '<div><div class="progress">' +
                            '<div class="bar" style="width:0%;"></div></div></div>' +
                            '<div class="start"><button>Start</button></div>'
                ) + '<div class="cancel"><button>Cancel</button></div></div></div></li>');
            row.find('.name').text(file.name);
            row.find('.size').text(o.formatFileSize(file.size));
            if (file.error) {
                row.find('.error').text(
                    locale.fileupload.errors[file.error] || file.error
                );
            }
            rows = rows.add(row);
        });
        return rows;
    },
Run Code Online (Sandbox Code Playgroud)

doo*_*owb 7

通过查看示例和现场演示,我创建了这个jsbin:http://jsbin.com/ivonow/1/

这是演示中的代码.我取出了html底部的jQuery模板,并将上面的uploadTemplate函数添加到设置fileupload对象时传入的选项中.

我还必须将uploadTemplateId和downloadTemplateId设置为null,这样它就不会尝试加载默认值:

{
  uploadTemplateId: null,
  downloadTemplateId: null,
}
Run Code Online (Sandbox Code Playgroud)

在html中,我拿出围绕行模板的表并添加了UL,但样式仍然很奇怪.

希望这可以帮助.