XMLHttpRequest页面无刷新上传文件

<input οnchange="fileSelected(this);" type="file"/>


function fileSelected(userfile) {

    uploadFile(userfile);
}
function uploadFile(userfile) {
    var fd = new FormData();
    fd.append("file",userfile.files[0]);//文件追到到FormData
    fd.append("folders_name","dzkb/12");
    fd.append("operation","update_image");
    var xhr = new XMLHttpRequest();
    xhr.upload.addEventListener("progress", uploadProgress, false);
    xhr.addEventListener("load", uploadComplete, false);
    xhr.addEventListener("error", uploadFailed, false);
    xhr.addEventListener("abort", uploadCanceled, false);
    xhr.open("POST", "http://img.myxinhai.cn:8081/upload_img.php");
    xhr.send(fd);
}
//图片上传进度
function uploadProgress(evt) {
    if (evt.lengthComputable) {
        var percentComplete = Math.round(evt.loaded * 100 / evt.total);
        if(percentComplete < 100)layer.load();
        else layer.closeAll();
        console.log(percentComplete) ;
        }else {
            
        }
}
//图片上传完成
function uploadComplete(evt) {
    var json = eval('(' + evt.target.responseText + ')');
    //图片上传完成服务器相应
    console.log(json) ;
}
function uploadFailed(evt) {
    alert("上传失败");
}
function uploadCanceled(evt) { //
    alert("已经取消上传");
}

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值