最近公司要做手机端网站 要用到图片上传， 手机端一般不能用 swfupload 类似flash的上传工具 (对 flash 支持不好) 不过现在手机 都支持html5了 所以 这几天网上查了下 实现使用html5 上传文件
其实 html5 上传文件挺简单的 ， 直接 new formdata(); 这个基于xmlhttprequest 2 新增的api 就好了
你可以先创建一个空的 formdata 对象,然后使用 append() 方法向该对象里添加字段，如下：
我要评论
<script type="text/javascript">
var omyform = new formdata();
omyform.append("username", "groucho");
omyform.append("accountnum", 123456); // 数字123456被立即转换成字符串"123456"
// fileinputelement中已经包含了用户所选择的文件
omyform.append("userfile", document.elementbyid('file').files[0]);
omyform.append("webmasterfile", oblob);
var oreq = new xmlhttprequest();
oreq.open("post", "__url__/api/upload");
oreq.send(omyform);
</script>
这样就实现了 往后端上传文件
当然你也可以在 file 里面设置 只允许上传图片 accept 属性
vm.save = function(){
var data = new formdata();
data.append('a_id', model.a_id);
data.append('name', model.name);
data.append('sort', model.sort);
data.append('file', $('#aaa')[0].files[0]);
$.ajax({
url: '__url__/picsave',
type: 'post',
data: data,
processdata: false, // 告诉jquery不要去处理发送的数据
contenttype: false // 告诉jquery不要去设置content-type请求头
}).done(function(ret){
if (ret) {
alert(ret);
}else{
alert('保存成功！');
//location = '__url__';
}
});
return false;
};
今天先说到这里吧 继续忙了
如对本文有疑问， 点击进行留言回复！！
网友评论