这个插件为什么可以通过ajax上传文件？

我们知道该文件不能通过ajax上传，但我不明白为什么这ajax upload file plugin使用普通的ajax？这个插件为什么可以通过ajax上传文件？

_upload: function(id, params){ 
     var file = this._files[id], 
      name = this.getName(id), 
      size = this.getSize(id); 

     this._loaded[id] = 0; 

     var xhr = this._xhrs[id] = new XMLHttpRequest(); 
     var self = this; 

     xhr.upload.onprogress = function(e){ 
      if (e.lengthComputable){ 
       self._loaded[id] = e.loaded; 
       self._options.onProgress(id, name, e.loaded, e.total); 
      } 
     }; 

     xhr.onreadystatechange = function(){    
      if (xhr.readyState == 4){ 
       self._onComplete(id, xhr);      
      } 
     }; 

     // build query string 
     params = params || {}; 
     params['qqfile'] = name; 
     var queryString = qq.obj2url(params, this._options.action); 

     xhr.open("POST", queryString, true); 
     xhr.setRequestHeader("X-Requested-With", "XMLHttpRequest"); 
     xhr.setRequestHeader("X-File-Name", encodeURIComponent(name)); 
     xhr.setRequestHeader("Content-Type", "application/octet-stream"); 
     xhr.send(file); 
    }

我不喜欢这个插件，因为你不能用jQuery和目标元素中使用它必须是一个ID，

function createUploader(){    
      var uploader = new qq.FileUploader({ 
       element: document.getElementById('file-uploader-demo1'), 
      action: 'upload-file.php', 
       onComplete: function(id, fileName, responseJSON){alert(responseJSON[0].filename)}, 
       debug: true 
      });   
     } 

     // in your app create uploader as soon as the DOM is ready 
     // don't wait for the window to load 
     window.onload = createUploader;

这将是我所需要的，如果我可以这样做这与jquery，但我只是不知道如何改变源代码，因为它是用纯JavaScript编写的！

element: $('.upload'), or element: $('#upload'),

来源

2011-08-21 laukok

如果我没有弄错，更新的浏览器（除了原因的IE浏览器，部分webkit也是我认为的），只能用ajax上传文件。这是由于javascript/html5中的新文件api。哦，顺便说一下，你知道jQuery **是** javascript，对吧？所以说你不能阅读它，因为它是纯javascript，而不是jQuery只是没有任何意义： -/ – Alxandr

大声笑它需要更长的时间来理解纯js比jquery ... :-)像普通的js ajax code - 我真的不明白它...... :-( – laukok

只是给你另一种选择，有几个很好的文件上传是用jquery编写的。如果你愿意尝试别人，我推荐Uploadify。但是，这个上传器确实需要Flash。

编辑： 我不知道这个上传器如何使用ajax;它可以像Sheen提到的那样在html5中完成。然而，通过对计算器一点点的搜索，似乎你可以尝试这让它使用jQuery选择工作：

element: $('#upload')[0];

，我发现，问题document-getelementbyid-vs-jquery

来源

2011-08-21 02:05:56

你没有回答他的问题...... D：我也想知道。 – danem

@Pete我不知道他到底会做什么将工具更改为jquery，但是我已经成功使用Uploadify，我推荐这样做，以便他知道还有其他选项可用，有时，问题的答案也可以间接地帮助askee直接而不是真正地解决问题回答他的问题 –

@jmein我认为OP不想改变它，他想知道它是如何完成的 – Rafay

这看起来HTML5这个解决方案。你可以在html5中通过ajax进行文件上传。 http://blog.new-bamboo.co.uk/2010/7/30/html5-powered-ajax-file-uploads

来源

2011-08-21 02:22:11

这个插件为什么可以通过ajax上传文件？

回答

相关问题