html5中上传图片

简介: 从相册中选择图片上传 function uploadFromAlbum(type) { var dirtype = ""; if ("pick_store_license" == type || "pick_id_pic" == type) { dirty...

从相册中选择图片上传

function uploadFromAlbum(type) {
    var dirtype = "";
    if ("pick_store_license" == type || "pick_id_pic" == type) {
        dirtype = "auth";
    }
    if ("pick_store_pic" == type) {
        dirtype = "store";
    }
    plus.gallery.pick(
        function (path) {
            //选择成功
            $("#heisebg").removeClass("heisebg").addClass("heisebghid");
            $("#waitingupload").removeClass("heisebghid").addClass("heisebg");
            var task = plus.uploader.createUpload(configManager.RequstUrl + "api/common/upload",
                { method: "POST", blocksize: 102400, priority: 100 },
                function (upload, status) {
                    // 上传完成
                    if (status == 200) {
                        var data = JSON.parse(upload.responseText);
              //显示图片
              ... ... $(
"#waitingupload").removeClass("heisebg").addClass("heisebghid"); } else { console.log("Upload failed: " + status); } } ); task.addFile( path, { key: "file" }); task.addData("dir", dirtype); task.start(); }, function (e) { console.log(e); }, { filter: "image" } ); }

函数套函数,要分清楚当前这个函数到底有那些参数。拍照上传的方法如下:

//从摄像头中拍照
function uploadFromCamera(type) {
    var dirtype = "";
    if ("pick_store_license" == type || "pick_id_pic" == type) {
        dirtype = "auth";
    }
    if ("pick_store_pic" == type) {
        dirtype = "store";
    }

    var cmr = plus.camera.getCamera(1);
    if (null != cmr) {
        //拍照
        cmr.captureImage(function (p) {
            plus.io.resolveLocalFileSystemURL(
            p,
            function (entry) {
                //拍照成功
                $("#heisebg").removeClass("heisebg").addClass("heisebghid");
                $("#waitingupload").removeClass("heisebghid").addClass("heisebg");
                //上传图片
                var task = plus.uploader.createUpload(configManager.RequstUrl + "/api/common/upload",
                    { method: "POST", blocksize: 102400, priority: 100 },
                    function (upload, status) {
                        // 上传完成
                        if (status == 200) {
                            var data = JSON.parse(upload.responseText);
                //显示图片
                ... ...
console.log(upload.responseText); } else { console.log("Upload failed: " + status); } } ); task.addFile("file://" + entry.fullPath, { key: "file" }); task.addData("dir", dirtype); task.start(); }, function (e) { plus.ui.alert(e.message, function () { }, configManager.alerttip, configManager.alertCtip); } ); }, function (e) { }, { filename: "_doc/camera/" }); } else { plus.ui.alert("没有找到摄像头", function () { }, configManager.alerttip, configManager.alertCtip); } }

注意这一句task.addFile("file://" + entry.fullPath, { key: "file" }); 前面要加上file://防止在ios下找不到图片路径。

作者:Tyler Ning
出处:http://www.cnblogs.com/tylerdonet/
本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,如有问题,可以通过以下邮箱地址williamningdong@gmail.com  联系我,非常感谢。

目录
相关文章
|
3月前
|
移动开发 前端开发 JavaScript
基于 HTML5 和 Canvas 开发的在线图片编辑器
基于 HTML5 和 Canvas 开发的在线图片编辑器
73 0
|
18天前
|
前端开发
Twaver-HTML5基础学习(37)network导出图片并下载
本文介绍了如何在Twaver-HTML5中将network导出为图片并提供下载,主要通过将network转换为canvas对象,然后转换为base64编码的图片进行展示和下载。
32 5
|
1月前
|
前端开发 Windows
【前端web入门第一天】02 HTML图片标签 超链接标签 音频标签 视频标签
本文档详细介绍了HTML中的图片、超链接、音频和视频标签的使用方法。首先讲解了`<img>`标签的基本用法及其属性,包括如何使用相对路径和绝对路径。接着介绍了`<a>`标签,用于创建超链接,并展示了如何设置目标页面打开方式。最后,文档还涵盖了如何在网页中嵌入音频和视频文件,包括简化写法及常用属性。
36 13
|
5月前
|
关系型数据库 MySQL
web简易开发(二){html5+php实现文件上传及通过关键字搜索已上传图片)}
web简易开发(二){html5+php实现文件上传及通过关键字搜索已上传图片)}
|
2月前
在线将多张图片拼接起来图工具HTML源码
在线将多张图片拼接成一张图片,多图合一并导出下载。无需本地安装软件。 下载时,使用日期时间作为文件名,规避图片文件名相同造成的覆盖问题;也能省去一部覆盖确认操作 多语言支持
31 0
在线将多张图片拼接起来图工具HTML源码
|
5月前
|
移动开发
uni-app使用v-html输出富文本图片溢出解决
uni-app使用v-html输出富文本图片溢出解决
536 1
|
2月前
|
Python
Python 下载 html 中的 图片
Python 下载 html 中的 图片
25 2
|
3月前
|
数据采集 缓存 自然语言处理
PHP将HTML标签转化为图片
通过这个方法,PHP后端能够实现将HTML内容转化为图片的功能。这种方式虽然牵涉到一些额外的安装和配置,但能够相对灵活且稳定地解冀转换需求,适用于需要在后端动态生成图片的场景。
96 1
|
3月前
|
JavaScript 前端开发 CDN
vue 生成分享海报、下载图片(含生成二维码qrcodejs2的使用,网页截屏html2canvas的使用)
vue 生成分享海报、下载图片(含生成二维码qrcodejs2的使用,网页截屏html2canvas的使用)
36 0
vue 生成分享海报、下载图片(含生成二维码qrcodejs2的使用,网页截屏html2canvas的使用)
|
4月前
|
移动开发 前端开发 JavaScript
将HTML5 Canvas的内容保存为图片
将HTML5 Canvas的内容保存为图片
33 5