上传前jQuery删除预览

时间:2016-06-13 10:41:21

标签: javascript jquery

我想创建一个多文件输入,在上传之前预览图像。预览和删除功能正在运行,但当我尝试提交时,已发送的图像已发送

查看

<input type="file" accept="file_extension|image/*" id="postfile" name="postfile[]" multiple>
<output id="list"></output>

的Javascript

function handleFileSelect(evt) {
    var files = evt.target.files; 
    for (var i = 0, f; f = files[i]; i++) {
      if (!f.type.match('image.*')) {
        continue;
      }
      var reader = new FileReader();
      reader.onload = (function(theFile) {
        return function(e) {
          var span = document.createElement('span');
          span.innerHTML = ['<img class="thumb" src="', e.target.result,
                            '" title="', escape(theFile.name), '"/><a href="#" class="remove">Remove</a>'].join('');
          document.getElementById('list').insertBefore(span, null);
          span.children[1].addEventListener("click", function(event){
            span.parentNode.removeChild(span);
          });
        };
      })(f);
      reader.readAsDataURL(f);
    }
  }

  document.getElementById('postfile').addEventListener('change', handleFileSelect, false);

任何帮助将不胜感激。非常感谢你

0 个答案:

没有答案