/*wx.config({
debug: false,
appId: data.appid,
timestamp: data.timestamp,
nonceStr: data.nonceStr,
signature: data.signature,
jsApiList: ['checkJsApi', 'chooseImage', 'previewImage', 'uploadImage', 'downloadImage']
});

wx.ready(function () {
//
});*/

//onclick事件
var images = {
localId: [],
serverId: [],
downloadId: []
};
document.querySelector('#selectImage').onclick = function () {
wx.chooseImage({
success: function (res) {
images.localId = res.localIds;
jQuery(function(){
$.each( res.localIds, function(i, n){
$("#img").append('<img src="'+n+'" /> <br />');
});
});
}
});
};

document.querySelector('#uploadImage').onclick = function () {
if (images.localId.length == 0) {
alert('请先使用选择图片按钮');
return;
}
images.serverId = [];
jQuery(function(){
$.each(images.localId, function(i,n) {
wx.uploadImage({
localId: n,
success: function (res) {
images.serverId.push(res.serverId);
alert(res.serverId);
},
fail: function (res) {
alert(JSON.stringify(res));
}
});
});
});
};

document.querySelector('#downloadImage').onclick = function () {
if (images.serverId.length == 0) {
alert('请先按上传图片按钮');
return;
}
jQuery(function() {
$.each(images.serverId, function (i, n) {
wx.downloadImage({
serverId: n,
success: function (res) {
images.downloadId.push(res.localId);
}
});
});
$.each( images.downloadId, function(i, n){
alert(n);
$("#img2").append('<img src="'+n+'" /> <br />');
});
});
};

document.querySelector('#previewImage').onclick = function () {
var imgList = [
'http://wp83.net__PUBLIC__/images/gallery/image-1.jpg',
'http://wp83.net__PUBLIC__/images/gallery/image-2.jpg'
];
wx.previewImage({
current: imgList[0],
urls: imgList
});
};

//返回错误
wx.error(function(res){
var str = res.errMsg;
var reg = /invalid signature$/;
var r = str.match(reg);
if(r !== null) {
jQuery(function(){
$.getJSON('http://www.demo.com/tp/home/index/ticket', function(data) {
if(data) {
alert('ticket update');
location = location;
window.navigate(location);
}
});
});
}
});

jssdk微信图片上传功能的更多相关文章

  1. android之使用GridView+仿微信图片上传功能

    由于工作要求最近在使用GridView完成图片的批量上传功能,我的例子当中包含仿微信图片上传.拍照.本地选择.相片裁剪等功能,如果有需要的朋友可以看一下,希望我的实际经验能对您有所帮助. 直接上图,下 ...

  2. Android仿微信图片上传,可以选择多张图片,缩放预览,拍照上传等

    仿照微信,朋友圈分享图片功能 .可以进行图片的多张选择,拍照添加图片,以及进行图片的预览,预览时可以进行缩放,并且可以删除选中状态的图片 .很不错的源码,大家有需要可以下载看看 . 微信 微信 微信 ...

  3. 前端丨如何使用 tcb-js-sdk 实现图片上传功能

    前言 tcb-js-sdk 让开发者可以在网页端使用 JavaScript 代码服务访问云开发的服务,以轻松构建自己的公众号页面或者独立的网站等 Web 服务.本文将以实现图片上传功能为例,介绍 tc ...

  4. thinkphp达到UploadFile.class.php图片上传功能

    片上传在站点里是非经常常使用的功能.ThinkPHP里也有自带的图片上传类(UploadFile.class.php) 和图片模型类(Image.class.php).方便于我们去实现图片上传功能,以 ...

  5. Spring+SpringMVC+MyBatis+easyUI整合优化篇(七)图片上传功能

    日常啰嗦 前一篇文章<Spring+SpringMVC+MyBatis+easyUI整合优化篇(六)easyUI与富文本编辑器UEditor整合>讲了富文本编辑器UEditor的整合与使用 ...

  6. PHP语言学习之php做图片上传功能

    本文主要向大家介绍了PHP语言学习之php做图片上传功能,通过具体的内容向大家展示,希望对大家学习php语言有所帮助. 今天来做一个图片上传功能的插件,首先做一个html文件:text.php < ...

  7. [Ting's笔记Day8]活用套件carrierwave gem:(3)Deploy图片上传功能到Heroku网站

    前情提要: 身为Ruby新手村民,创造稳定且持续的学习步调很重要,我用的方法就是一周在IT邦写三篇笔记,希望藉由把笔记和遇到的bug记录下来的过程,能帮助到未来想用Ruby on Rails架站的新手 ...

  8. 微信图片上传,遇到一个神奇的jgp

    微信图片上传,获取图片base64遇到一个神奇的   jgp var imgFn = function (event) { event.preventDefault(); var id = '#'+$ ...

  9. H5 利用vue实现图片上传功能。

    H5的上传图片如何实现呢? 以下是我用vue实现的图片上传功能,仅供参考. <!DOCTYPE html> <html> <head> <meta chars ...

随机推荐

  1. 聊聊高并发(二十五)解析java.util.concurrent各个组件(七) 理解Semaphore

    前几篇分析了一下AQS的原理和实现.这篇拿Semaphore信号量做样例看看AQS实际是怎样使用的. Semaphore表示了一种能够同一时候有多个线程进入临界区的同步器,它维护了一个状态表示可用的票 ...

  2. 密钥登录linux

    一.linux 主机A登录linux主机B 在/etc/hosts文件下加入:(做硬解析) 192.168.1.60 u60 #设置u60为主机名 在节点A上创建RSA秘钥:(A上生成A主机密钥) # ...

  3. IOS7 适配以及向下兼容问题

    1.所有的UIViewController加如下方法.     - (void) viewDidLayoutSubviews {         if ([[[UIDevice currentDevi ...

  4. 自定义ActionBar背景(分别针对3.0以下和3.0以上的版本)

    官方原文:http://developer.android.com/training/basics/actionbar/styling.html 针对3.0以上的版本: <?xml versio ...

  5. [转][Swust OJ 24]--Max Area(画图分析)

    转载自:http://www.cnblogs.com/hate13/p/4160751.html Max Area 题目描述:(链接:http://acm.swust.edu.cn/problem/2 ...

  6. Week2(9月16日):动手做个简单的例子

    Part I:提问  =========================== 1.什么是ASP.NET MVC? 2.MVC的英文? 3.什么是模型? 4.什么是控制器? 5.什么是视图? 6.ASP ...

  7. oschina应用工具

    应用工具 22思维导图软件 9博客客户端 15加密/解密/破解 120浏览器 78邮件工具 327文档/文本编辑 31杀毒软件 177终端/远程登录 195IM/聊天/语音工具 74下载工具 64文件 ...

  8. Codeforces 331A2 - Oh Sweet Beaverette (70 points)

    贪心搞就行,用map记录每个数出现的下标,每次都取首尾两个.将中间权值为负的删掉后取sum值最大的就行. #include<iostream> #include<algorithm& ...

  9. Storm 配置图文解析

    Storm 配置图文解析 參考阅读:http://www.xiaofateng.com/? p=959 ============================== | sample-topology ...

  10. BT基础知识简介

    1. 蓝牙概述   无线局域网的通信 适用范围:10米到100米(根据发射功率的class不同有所差别,典型的class2为10m,而class1为100m,class3为1m) 应用:   局域网络 ...