使用FormData对象上传文件

<input type="file" name="file" id='chooseFile'/>

var form = document.getElementById("chooseFile");form.addEventListener('change', function(ev) {//监听file控件值的变化  var oData = new FormData();  var file=this.files[0];  //拼接参数  formData.append('file', file);  // 文件  formData.append('params', '参数');  formData.append('array',JSON.stringify([1,2,3]));   var xhr = new XMLHttpRequest();  xhr.open("post",url,true); //post方式，url为服务器请求地址，true 该参数规定请求是否异步处理。  xhr.upload.onloadstart = function(){//上传开始      //...  };  xhr.upload.onprogress = function(evt){//显示上传进度条    var loaded = evt.loaded;//已经上传大小情况    var tot = evt.total;//附件总大小    var per = Math.floor(100 * loaded / tot);  //已经上传的百分比    $('#uploadprogress').removeClass('hide').css('width',per+'%');  };  xhr.onload = function (evt) {//上传完成     //...         };  xhr.onerror = function () {    alert('上传失败');  }; xhr.send(oData); //开始上传，发送form数据}, false);

拖拽上传

<textarea class="divFile7" style="min-width:800px;height:150px" placeholder="请将文件拖拽或直接粘贴到这里"></textarea>

 $(".divFile7")[0].ondrop = function (event) {     event.preventDefault();//不要执行与事件关联的默认动作     var files = event.dataTransfer.files;//获取拖上来的文件     //以下代码不变     var formData = new FormData();     //参照上面代码...... };

使用jqery上传文件的注意事项
需设置processData参数为false

$.ajax({     url: "/Home/SaveFile2",     type: "POST",     data: formData,     processData: false,  // 告诉jQuery不要去处理发送的数据     contentType: false,   // 告诉jQuery不要去设置Content-Type请求头     success: function (responseText) {         alert(responseText);     } });

监听黏贴操作将图片转换为base64

document.getElementById('messageText').addEventListener('paste',function(e){        var data=e.clipboardData||window.clipboardData;        blob=data.items[0].getAsFile();//获取图片内容        var isImg=(blob&&1)||-1;//判断是不是图片，最好通过文件类型判断        var reader=new FileReader();        if(isImg>=0){            reader.readAsDataURL(blob);//将文件读取为 DataURL        }        reader.onload=function(event){//文件读取完成时触发            //event.target.result就是我们要的base64编码        };});