zoukankan      html  css  js  c++  java
  • h5+ 上传图片(选择图片、拍照)

    $(document).on('click','.upimgbtn', function() {
        var pos = $(this).data('pos');
        var posTxt = {'photo1':'照片1','photo2':'照片2','photo3':'照片3'};
        var that = this;
        if(mui.os.plus) {
            var a = [{
                title: "拍照"
            }, {
                title: "从手机相册选择"
            }];
            plus.nativeUI.actionSheet({
                title: posTxt[pos]+"上传",
                cancel: "取消",
                buttons: a
            }, function(b) { /*actionSheet 按钮点击事件*/
                switch(b.index) {
                    case 0:
                        break;
                    case 1:
                        getImage(that,pos); /*拍照*/
                        break;
                    case 2:
                        galleryImg(that,pos); /*打开相册*/
                        break;
                    default:
                        break;
                }
            })
        }
    });
    
    
    //拍照
    function getImage(that,pos) {
        var cmr = plus.camera.getCamera();
        cmr.captureImage(function(p) {
            //alert(p);//_doc/camera/1467602809090.jpg
            plus.io.resolveLocalFileSystemURL(p, function(entry) {
                //alert(entry.toLocalURL());//file:///storage/emulated/0/Android/data/io.dcloud...../doc/camera/1467602809090.jpg
                //alert(entry.name);//1467602809090.jpg
                var path = (entry.toLocalURL());
                $(that).html("<img src='" + path + "' style='display:block;' />")
    
                zoomImage(path,pos)
                // upload(path,pos)
            }, function(e) {
                plus.nativeUI.toast("读取拍照文件错误:" + e.message);
            });
        }, function(e) {}, {
            filename: "_doc/camera/",
            index: 1
        });
    }
    //本地相册选择
    function galleryImg(that,pos) {
        plus.gallery.pick(function(path) {
            // alert("get image success: " + path);
            $(that).html("<img src='" + path + "' style='display:block;' />")
    
            zoomImage(path,pos)
            // upload(path,pos)
    
        }, function(e) {
            console.log("取消选择图片");
        }, {
            filter: "image"
        });
    };
    
    
    function upload(path,pos){
        var wt=plus.nativeUI.showWaiting();
        var task=plus.uploader.createUpload(baseUrl+'/upload',
            {method:"POST"},
            function(t,status){ //上传完成
                if(status==200){
        //             var data=JSON.parse(t.responseText);
                    // if(data.code == 1){
                        switch(pos){
                            case 'photo1':
                                                                // 上传结果(服务器图片地址)处理
                                                               break;
    
                    // }
                    // alert("上传成功:"+t.responseText);
                    wt.close(); //关闭等待提示按钮
                }else{
                    // alert("上传失败:"+status);
                    wt.close();//关闭等待提示按钮
                }
            }
        );
        //添加其他参数
        // task.addData("name","test");
        task.addFile(path,{key:"file"});
        task.start();
    }
    
    //缩放图片
    function zoomImage(path,pos){
        plus.zip.compressImage({
                src:path,
                dst:path,
                '800px',        // 缩小
                overwrite: true
            },
            function() {
                upload(path,pos)
                // alert("Compress success!");
            },function(error) {
                // alert("Compress error!");
        });
    }
  • 相关阅读:
    pandas DataFrame.shift()函数
    pandas DataFrame applymap()函数
    pandas的qcut()方法
    pandas DataFrame(3)-轴
    pandas DataFrame(4)-向量化运算
    pandas通过皮尔逊积矩线性相关系数(Pearson's r)计算数据相关性
    pandas DataFrame(2)-行列索引及值的获取
    pandas DataFrame(1)
    numpy数组(5)-二维数组的轴
    numpy数组(4)-二维数组
  • 原文地址:https://www.cnblogs.com/benlightning/p/12986373.html
Copyright © 2011-2022 走看看