您的位置:首页 > 移动开发 > IOS开发

plupload自动生成input控件选择按钮,ios手机却无法选择

2016-12-20 15:18 232 查看
  网上有很多关于plupload这个插件的详解知识,我今天不讲它的参数、属性或者方法这些,因为http://chaping.github.io/plupload/doc/此链接完全详细描述,其他的可以自己搜索有关文章


  我使用plupload这个控件,只因为我需要做一个上传视频、资料或者照片到OSS(阿里云存储)的前端效果。在OSS的文档中有一个自己的事例,
[/code] 页面显示如图:

点击选择文件按钮,就会弹出选择文件的相册,点击开始上传,即开始上传。

        我就在这个效果的基础上,编写了我自己的程序。一开始没有出现bug,也没有修改过代码,几天后发现出现问题,安卓手机可以点击图标,出现相册弹出框进行选择,但是ios手机却怎么点击都没有效果。这让我一脸蒙,明明没有改动代码,怎么前几天还没出现问题,现在苹果手机却点击无响应呢?

        我一开始以为是我的javascript代码有问题,就从头console.log()、debug。但是控制台却没有出现错误。在经历了时间的消逝后,我改变了一下思路。也许我的js代码就没有出现问题。我开始从样式入手,最后发现,plupload这个插件有一个属性browse_button,它的作用是触发文件选择对话框的DOM元素,当点击该元素后便后弹出文件选择对话框,该值可以是DOM元素对象本身,也可以是该DOM元素的id。但实际上plupload是自动生成一个上传file的input,即:

         <div  style="position: absolute; top: 0px; left: 0px; width: 0px; height: 0px; overflow: hidden;">  

                    <input  type="file" style="font-size: 999px; opacity: 0; position: absolute; top: 0px; left: 0px; width: 100%; height: 100%;" >

         </div>

所以在样式调整上,不同的手机因为分辨率不同,点击我们自己设置的上传按钮,没有与input按钮重合,尤其苹果手机明显,所以就没有触发事件。只需要加一句

         function functionTimeout(){

                   uploader.refresh();

         }

         window.setTimeout("functionTimeout();",1000);   

        即可解决问题。

    


                                            
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: 
相关文章推荐