javascript - "Cannot read property of innerhtml null "问题

Question

我正在使用 jQueryFileUpload。我的 html 看起来像:

<input name='memoir[image]' type='file' data-url='memoirs/create' multiple="true" class='fileupload' />

<ul class='list'>
</ul>

和我的 jQuery:

$('.fileupload').fileupload({
    dataType: 'json',

    add: function (e, data) {
      var tpl = $('<li class="working"><div class="bar" style="width: 0%"></div><input type="text" value="0" data-width="48" data-height="48"'+
            ' data-fgColor="#0788a5" data-readOnly="1" data-bgColor="#3e4043" /><p></p><span></span></li>');

      tpl.find('p').text(data.files[0].name);
      data.context = tpl.appendTo($(this).next($(".list")));


      types = /(\.|\/)(gif|jpe?g|png)$/i;
      file = data.files[0];
      if (types.test(file.type) || types.test(file.name)) {
        alert("Added and validated");
        data.context = $(tmpl("template-upload", file));
        $('.fileupload').append(data.context);

        data.submit();
      } else {
        alert("#{file.name} is not a gif, jpeg, or png image file");
      }
    },
    progress: function (e, data) {
      if (data.context) {
        alert("In progress");
        progress = parseInt(data.loaded / data.total * 100, 10);
        data.context.find('.bar').css('width', progress + '%');
        if(progress == 100){
            data.context.removeClass('working');
        }
      }
    }
});

现在，我收到错误:

Uncaught TypeError: Cannot read property 'innerHTML' of null

在jQuery File Upload自带的tmpl.js中。它说错误在进度函数开始的那一行？

感谢大家的帮助!

Answer 1

在 tmpl.js 文件中，它在此处查找 ID:

tmpl.load = function (id) {
    return document.getElementById(id).innerHTML;
};

如果它返回 NULL，这意味着您没有在任何地方定义变量“id”...

除非我弄错了，否则您不需要基本 文件上传脚本的模板 Material (tmpl.js) 即可工作；根据开发人员的说法，它是可选的:https://github.com/blueimp/jQuery-File-Upload