html 自定义文件选择,html5 自定义文件上传

文件上传

Click to upload!

//触发 文件上传组件的 click 事件 ， 打开文件上传的对话窗口

document.getElementById("yourBtn").onclick = function () {

document.getElementById("upfile").click();

};

//文件上传

document.getElementById("upfile").onchange = function () {

var url = '';

var xhr = new XMLHttpRequest();

// html5 的 form api

var fd = new FormData();

//异步 post 方式请求

xhr.open('POST', url, true);

//状态监听

xhr.onreadystatechange = function () {

if (xhr.readyState == 4 && xhr.status == 200) {

alert('文件上传成功！');

}

};

//添加参数

fd.append('file', this.files[0]);

xhr.send(fd);

};