加入收藏 | 设为首页 | 会员中心 | 我要投稿 焦作站长网 (https://www.0391zz.com/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 站长学院 > MySql教程 > 正文

HTML5 Plus 实现手机APP拍照或相册选择图片上传功能

发布时间:2020-03-13 20:45:39 所属栏目:MySql教程 来源:站长网
导读:这篇文章主要为大家详细介绍了HTML5 Plus的Camera、GalleryIO、Storage和Uploader,实现手机APP拍照或相册选择图片上传功能的相关资料,感兴趣的小伙伴们可以参

   var name="_doc/upload/"+divid+"-"+filename;//_doc/upload/F_ZDDZZ-1467602809090.jpg   

   plus.zip.compressImage({   

     src:url,//src: (String 类型 )压缩转换原始图片的路径   

     dst:name,//压缩转换目标图片的路径   

     quality:20,//quality: (Number 类型 )压缩图片的质量.取值范围为1-100   

     overwrite:true//overwrite: (Boolean 类型 )覆盖生成新文件   

    },   

    function(event) {    

     //uploadf(event.target,divid);   

     var path = name;//压缩转换目标图片的路径   

     //event.target获取压缩转换后的图片url路   

     //filename图片名称   

     saveimage(event.target,divid,filename,path);   

    },function(error) {   

     plus.nativeUI.toast("压缩图片失败,请稍候再试");   

   });   

  }   

  //保存信息到本地   

  /**   

   *    

   * @param {Object} url  图片的地址   

   * @param {Object} divid  字段的名称   

   * @param {Object} name   图片的名称   

   */   

  function saveimage(url,divid,name,path){   

   //alert(url);//file:///storage/emulated/0/Android/data/io.dcloud...../doc/upload/F_ZDDZZ-1467602809090.jpg   

   //alert(path);//_doc/upload/F_ZDDZZ-1467602809090.jpg   

   var  state=0;   

   var wt = plus.nativeUI.showWaiting();   

    //  plus.storage.clear();    

   namename=name.substring(0,name.indexOf("."));//图片名称:1467602809090   

   var id = document.getElementById("ckjl.id").value;   

   var itemname=id+"img-"+divid;//429img-F_ZDDZ   

   var itemvalue=plus.storage.getItem(itemname);   

   if(itemvalue==null){   

    itemvalue="{"+name+","+path+","+url+"}";//{IMG_20160704_112614,_doc/upload/F_ZDDZZ-IMG_20160704_112614.jpg,file:///storage/emulated/0/Android/data/io.dcloud...../doc/upload/F_ZDDZZ-1467602809090.jpg}   

   }else{     

    itemvalueitemvalue=itemvalue+"{"+name+","+path+","+url+"}";   

   }   

   plus.storage.setItem(itemname, itemvalue);   

      

   var src = 'src="'+url+'"';   

   //alert("itemvalue="+itemvalue);   

   showImgDetail(name,divid,id,src);   

   wt.close();   

      

  }   

  //上传图片,实例中没有添加上传按钮   

  function uploadimge(agree,back) {   

  //plus.storage.clear();   

   var wa = plus.nativeUI.showWaiting();   

   var DkeyNames=[];   

   var id = document.getElementById("ckjl.id").value;    

   var length=id.toString().length;    

   var ididnmae=id.toString();   

   var numKeys=plus.storage.getLength();   

   var task = plus.uploader.createUpload(getUrl() + 'url', {   

        method: "POST"   

       },   

       function(t, status) {   

        if (status == 200) {   

         console.log("上传成功");   

          $.ajax({   

          type: "post",   

          url: getUrl() + 'url',   

          data: {   

           taskId: taskId,   

           voteAgree: agree,   

           back: back,   

           voteContent: $("#assign").val(),   

          },   

          async: true,   

          dataType: "text",   

          success: function(data) {   

           wa.close();   

           goList(data);   

             

              

          },   

          error: function() {   

           wa.close();   

           myAlert("网络错误,提交审批失败,请稍候再试");   

          }   

         });   

             

            

        } else {   

         wa.close();   

         console.log("上传失败");    

        }   

       }   

      );   

   task.addData("id",id);   

(编辑:焦作站长网)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

推荐文章
    热点阅读