应用在移动端网页的图片上传功能（纯手写）

文件上传触发

相应的JS(为了方便 用JQ写法)：
//上传文件函数
function onChange(){
//获取上传的图片的相应数据
var formData=$(“#upload”)[0].files[0]; //本地相对路径，用来判断格式 var value=$(“#upload”).val();
//限制文件类型
if (value == null||value == “”){ //如果路径错误
alert(“请选择要上传的图片!”);
return false;
}
if (value.lastIndexOf(‘.’)==-1){ //如果不存在”.”
alert(“路径不正确!”);
return false;
}
var AllImgExt=”.jpg|.jpeg|.gif|.bmp|.png|”; //限制图片的格式
var extName = value.substring(value.lastIndexOf(“.”)).toLowerCase();
if(AllImgExt.indexOf(extName+”|”)==-1){
$.toast(“文件类型出错”);
return false;
}
//图片AJAX上传 用原生的写法，兼容移动端
var form = new FormData();
form.append(“file”, formData);
var xhr = new XMLHttpRequest();
xhr.open(“post”, “url”, true);
xhr.onload = function (result){
var datas=eval(“(“+result.currentTarget.response+”)”);//这是返回结果为字符串，转出数组
//try catch为服务器传回乱码来预防错误
try{
if(datas.status==true){
}
else{
alert(“图片上传失败，请重试！”)
}
}catch (e){
}
}
xhr.send(form);//这个别漏了。。
}
最后需要说明下：现在这么写有个问题，就是第一次点击input,打开选择文件框，但是你点击取消的时候 onChange()事件不会触发，只有第一次选择图片上传之后后续的打开文件选择框，再点击取消也能触发onChange()事件。日后再完善！