【问题描述】
使用安卓手机的微信,点击文本上传框出现没有应用可执行此操作的提示
【问题常见还原】
测试代码:
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
</head>
<body>
t1
<h2>这是一个文件选择框,测试兼容性使用。</h2>
<div><input type="file" accept=".gif,.jpg,.jpeg,.png,.bmp" id="file"> </div>
<script type="text/javascript">
var _fileInput=document.getElementById("file");
_fileInput.addEventListener("change",function(){
if (_fileInput.files.length === 0) {
alert("请选择图片");
return; }
var oFile = _fileInput.files[0];
//if (!rFilter.test(oFile.type)) { alert("You must select a valid image file!"); return; }
/* if(oFile.size>5*1024*1024){
message(myCache.par.lang,{cn:"照片上传:文件不能超过5MB!请使用容量更小的照片。",en:"证书上传:文件不能超过100K!"})
changePanel("result");
return;
}*/
if(!new RegExp("(jpg|jpeg|gif|png)+","gi").test(oFile.type)){
layer.alert("照片上传:文件类型必须是JPG、JPEG、PNG或GIF!",3);
return;
}
alert("您选择了文件:"+oFile.name);
},false);
</script>
</body>
</html>
分别用uc浏览器,pc端正常选择文件,在微信端操作时候出现:
【问题解决方案】
经常排查发现,只有使用了accept属性时候微信浏览器才抽风,假如不使用,那么就会
测试代码如下:
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
</head>
<body>
t1
<h2>这是一个文件选择框,测试兼容性使用。</h2>
<div><input type="file" id="file"> </div>
<script type="text/javascript">
var _fileInput=document.getElementById("file");
_fileInput.addEventListener("change",function(){
if (_fileInput.files.length === 0) {
alert("请选择图片");
return; }
var oFile = _fileInput.files[0];
//if (!rFilter.test(oFile.type)) { alert("You must select a valid image file!"); return; }
/* if(oFile.size>5*1024*1024){
message(myCache.par.lang,{cn:"照片上传:文件不能超过5MB!请使用容量更小的照片。",en:"证书上传:文件不能超过100K!"})
changePanel("result");
return;
}*/
if(!new RegExp("(jpg|jpeg|gif|png)+","gi").test(oFile.type)){
layer.alert("照片上传:文件类型必须是JPG、JPEG、PNG或GIF!",3);
return;
}
alert("您选择了文件:"+oFile.name);
},false);
</script>
</body>
</html>
测试结果:
【推断】
在安卓app里面,通常都是自己开发一个界面让用户选择本机图片或者本机文件,通常都是一个新的activity,然后再原有的acivity通过intent来调用新的选择界面,一旦选择完毕再从新的activity返回到旧有界面进行处理,那么问题来了,现在版本的微信可能对input的accept属性进行了处理,希望可以判断这些属性来分别调用不同的activity,譬如,图片选择的activity,文件选择的activity,但是可能还没有做好对应的activity或者对这个accept属性处理不够好,出现了这个空activity问题,于是提示没有应用可以执行此操作。
【补充】
input的accept属性兼容性不知道如何,但是,在各个浏览器上面肯定都不太一样的,为了保险起见,前端需要判断文件后缀名,当然后台也要判断文件内容及相关格式。