怎么调用微信公众平台的上传图片按钮,ios 按钮点击没反应应。(手机端)

微信JS接口汇总及使用详解
投稿:hebedich
字体:[ ] 类型:转载 时间:
这篇文章主要介绍了微信JS接口汇总及使用详解,十分的全面、详尽,包含分享到朋友圈,分享给朋友,分享到QQ,拍照或从手机相册中选图,识别音频并返回识别结果,使用微信内置地图查看位置等接口,有需要的小伙伴参考下吧
1.引入JS文件
在需要调用JS接口的页面引入如下JS文件,(支持https):
备注:支持使用 AMD/CMD 标准模块加载方法加载
2.注入配置config接口
所有需要使用JSSDK的页面必须先注入配置信息,否则将无法调用(同一个url仅需调用一次,对于变化url的SPA的web app可在每次url变化时进行调用)。
wx.config({
&debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。
&appId: '', // 必填,公众号的唯一标识
&timestamp: , // 必填,生成签名的时间戳
&nonceStr: '', // 必填,生成签名的随机串
&signature: '',// 必填,签名,见附录1
&jsApiList: [] // 必填,需要使用的JS接口列表,所有JS接口列表见附录2
3.验证通过ready接口
wx.ready(function(){
&&& // config信息验证后会执行ready方法,所有接口调用都必须在config接口获得结果之后,config是一个客户端的异步操作,所以如果需要在页面加载时就调用相关接口,则须把相关接口放在ready函数中调用来确保正确执行。对于用户触发时才调用的接口,则可以直接调用,不需要放在ready函数中。
4.验证失败error接口
wx.error(function(res){
// config信息验证失败会执行error函数,如签名过期导致验证失败,具体错误信息可以打开config的debug模式查看,也可以在返回的res参数中查看,对于SPA可以在这里更新签名。
接口调用说明
所有接口通过wx对象(也可使用jWeixin对象)来调用,参数是一个对象,除了每个接口本身需要传的参数之外,还有以下通用参数:
success:接口调用成功时执行的回调函数。
fail:接口调用失败时执行的回调函数。
complete:接口调用完成时执行的回调函数,无论成功或失败都会执行。
cancel:用户点击取消时的回调函数,仅部分有用户取消操作的api才会用到。
trigger: 监听Menu中的按钮点击时触发的方法,该方法仅支持Menu中的相关接口。
以上几个函数都带有一个参数,类型为对象,其中除了每个接口本身返回的数据之外,还有一个通用属性errMsg,其值格式如下:
调用成功时:"xxx:ok" ,其中xxx为调用的接口名
用户取消时:"xxx:cancel",其中xxx为调用的接口名
调用失败时:其值为具体错误信息
判断当前客户端版本是否支持指定JS接口
wx.checkJsApi({
jsApiList: ['chooseImage'] // 需要检测的JS接口列表,所有JS接口列表见附录2,
success: function(res) {
// 以键值对的形式返回,可用的api值true,不可用为false
// 如:{"checkResult":{"chooseImage":true},"errMsg":"checkJsApi:ok"}
获取“分享到朋友圈”按钮点击状态及自定义分享内容接口
wx.onMenuShareTimeline({
&&& title: '', // 分享标题
&&& link: '', // 分享链接
imgUrl: '', // 分享图标
success: function () {
// 用户确认分享后执行的回调函数
cancel: function () {
// 用户取消分享后执行的回调函数
获取“分享给朋友”按钮点击状态及自定义分享内容接口
wx.onMenuShareAppMessage({
&&& title: '', // 分享标题
&&& desc: '', // 分享描述
&&& link: '', // 分享链接
&&& imgUrl: '', // 分享图标
&&& type: '', // 分享类型,music、video或link,不填默认为link
dataUrl: '', // 如果type是music或video,则要提供数据链接,默认为空
success: function () {
// 用户确认分享后执行的回调函数
cancel: function () {
// 用户取消分享后执行的回调函数
获取“分享到QQ”按钮点击状态及自定义分享内容接口
wx.onMenuShareQQ({
&&& title: '', // 分享标题
&&& desc: '', // 分享描述
&&& link: '', // 分享链接
&&& imgUrl: '' // 分享图标
success: function () {
// 用户确认分享后执行的回调函数
cancel: function () {
// 用户取消分享后执行的回调函数
获取“分享到腾讯微博”按钮点击状态及自定义分享内容接口
wx.onMenuShareWeibo({
&&& title: '', // 分享标题
&&& desc: '', // 分享描述
&&& link: '', // 分享链接
&&& imgUrl: '' // 分享图标
success: function () {
// 用户确认分享后执行的回调函数
cancel: function () {
// 用户取消分享后执行的回调函数
拍照或从手机相册中选图接口
wx.chooseImage({
&&& success: function (res) {
&&&&&&& var localIds = res.localI // 返回选定照片的本地ID列表,localId可以作为img标签的src属性显示图片
预览图片接口
wx.previewImage({
&&& current: '', // 当前显示的图片链接
&&& urls: [] // 需要预览的图片链接列表
上传图片接口
wx.uploadImage({
localId: '', // 需要上传的图片的本地ID,由chooseImage接口获得
isShowProgressTips: 1// 默认为1,显示进度提示
&&& success: function (res) {
&&&&&&& var serverId = res.serverId; // 返回图片的服务器端ID
备注:可用微信下载多媒体文件接口下载上传的图片,此处获得的 serverId 即 media_id,参考文档../12/58bfcfabbd501c7cd77c19bd9cfa8354.html
下载图片接口
wx.downloadImage({
serverId: '', // 需要下载的图片的服务器端ID,由uploadImage接口获得
isShowProgressTips: 1// 默认为1,显示进度提示
&&& success: function (res) {
&&&&&&& var localId = res.localId; // 返回图片下载后的本地ID
开始录音接口
wx.startRecord();
停止录音接口
wx.stopRecord({
&&& success: function (res) {
&&&&&&& var localId = res.localId;
监听录音自动停止接口
wx.onVoiceRecordEnd({
&&// 录音时间超过一分钟没有停止的时候会执行 complete 回调
complete: function (res) {
var localId = res.localId;
播放语音接口
wx.playVoice({
&&& localId: '' // 需要播放的音频的本地ID,由stopRecord接口获得
暂停播放接口
wx.pauseVoice({
&&& localId: '' // 需要暂停的音频的本地ID,由stopRecord接口获得
停止播放接口
wx.stopVoice({
&&& localId: '' // 需要停止的音频的本地ID,由stopRecord接口获得
监听语音播放完毕接口
wx.onVoicePlayEnd({
&&& serverId: '', // 需要下载的音频的服务器端ID,由uploadVoice接口获得
&&& success: function (res) {
&&&&&&& var localId = res.localId; // 返回音频的本地ID
上传语音接口
wx.uploadVoice({
localId: '', // 需要上传的音频的本地ID,由stopRecord接口获得
isShowProgressTips: 1// 默认为1,显示进度提示
&&& success: function (res) {
&&&&&&& var serverId = res.serverId; // 返回音频的服务器端ID
备注:可用微信下载多媒体文件接口下载上传的语音,此处获得的 serverId 即 media_id,参考文档../12/58bfcfabbd501c7cd77c19bd9cfa8354.html
下载语音接口
wx.downloadVoice({
serverId: '', // 需要下载的音频的服务器端ID,由uploadVoice接口获得
isShowProgressTips: 1// 默认为1,显示进度提示
&&& success: function (res) {
&&&&&&& var localId = res.localId; // 返回音频的本地ID
识别音频并返回识别结果接口
wx.translateVoice({
localId: '', // 需要识别的音频的本地Id,由录音相关接口获得
isShowProgressTips: 1, // 默认为1,显示进度提示
success: function (res) {
alert(res.translateResult); // 语音识别的结果
获取网络状态接口
wx.getNetworkType({
&&& success: function (res) {
&&&&&&& var networkType = res.networkT // 返回网络类型2g,3g,4g,wifi
使用微信内置地图查看位置接口
wx.openLocation({
&&& latitude: 0, // 纬度,浮点数,范围为90 ~ -90
&&& longitude: 0, // 经度,浮点数,范围为180 ~ -180。
&&& name: '', // 位置名
&&& address: '', // 地址详情说明
&&& scale: 1, // 地图缩放级别,整形值,范围从1~28。默认为最大
infoUrl: '' // 在查看位置界面底部显示的超链接,可点击跳转
获取地理位置接口
wx.getLocation({
&&& timestamp: 0, // 位置签名时间戳,仅当需要兼容6.0.2版本之前时提供
&&& nonceStr: '', // 位置签名随机串,仅当需要兼容6.0.2版本之前时提供
&&& addrSign: '', // 位置签名,仅当需要兼容6.0.2版本之前时提供,详见附录4
&&& success: function (res) {
&&&&&&& var longitude = res. // 纬度,浮点数,范围为90 ~ -90
&&&&&&& var latitude = res. // 经度,浮点数,范围为180 ~ -180。
&&&&&&& var speed = res. // 速度,以米/每秒计
&&&&&&& var accuracy = res. // 位置精度
隐藏右上角菜单接口
wx.hideOptionMenu();
显示右上角菜单接口
wx.showOptionMenu();
关闭当前网页窗口接口
wx.closeWindow();
批量隐藏功能按钮接口
wx.hideMenuItems({
&&& menuList: [] // 要隐藏的菜单项,所有menu项见附录3
批量显示功能按钮接口
wx.showMenuItems({
&&& menuList: [] // 要显示的菜单项,所有menu项见附录3
隐藏所有非基础按钮接口
wx.hideAllNonBaseMenuItem();
显示所有功能按钮接口
wx.showAllNonBaseMenuItem();
微信扫一扫
调起微信扫一扫接口
wx.scanQRCode({
desc: 'scanQRCode desc',
needResult: 0, // 默认为0,扫描结果由微信处理,1则直接返回扫描结果,
scanType: ["qrCode","barCode"], // 可以指定扫二维码还是一维码,默认二者都有
success: function () {
var result = res.resultS // 当needResult 为 1 时,扫码返回的结果
编辑收货地址接口
wx.editAddress(
&&& timestamp: 0, // 位置签名时间戳,仅当需要兼容6.0.2版本之前时提供
&&& nonceStr: '', // 位置签名随机串,仅当需要兼容6.0.2版本之前时提供
&&& addrSign: '', // 位置签名,仅当需要兼容6.0.2版本之前时提供,详见附录4
&&& success: function (res) {
&&&&&&& var userName = res.userN // 收货人姓名
&&&&&&& var telNumber = res.telN // 收货人电话
&&&&&&& var postalCode = res.postalC // 邮编
&&&&&&& var provinceName = res.provinceN // 国标收货地址第一级地址
&&&&&&& var cityName = res.cityN // 国标收货地址第二级地址
&&&&&&& var countryName = res.countryN // 国标收货地址第三级地址
&&&&&&& var address = res. // 详细收货地址信息
&&&&&&& var nationalCode = res.nationalC // 收货地址国家码
获取最近的收货地址接口
wx.getLatestAddress({
&&& timestamp: 0, // 位置签名时间戳,仅当需要兼容6.0.2版本之前时提供
&&& nonceStr: '', // 位置签名随机串,仅当需要兼容6.0.2版本之前时提供
&&& addrSign: '', // 位置签名,仅当需要兼容6.0.2版本之前时提供,详见附录4
&&& success: function (res) {
&&&&&&& var userName = res.userN // 收货人姓名
&&&&&&& var telNumber = res.telN // 收货人电话
&&&&&&& var postalCode = res.postalC // 邮编
&&&&&&& var provinceName = res.provinceN // 国标收货地址第一级地址
&&&&&&& var cityName = res.cityN // 国标收货地址第二级地址
&&&&&&& var countryName = res.countryN // 国标收货地址第三级地址
&&&&&&& var address = res. // 详细收货地址信息
&&&&&&& var nationalCode = res.nationalC // 收货地址国家码
跳转微信商品页接口
wx.openProductSpecificView({
productId: '', // 商品id
viewType: '' // 0.默认值,普通商品详情页1.扫一扫商品详情页2.小店商品详情页
调起适用于门店的卡券列表并获取用户选择列表
wx.chooseCard({
&&& shopId: '', // 门店Id
&&& cardType: '', // 卡券类型
&&& cardId: '', // 卡券Id
&&& timeStamp: 0, // 卡券签名时间戳
&&& nonceStr: '', // 卡券签名随机串
&&& cardSign: '', // 卡券签名,详见附录6
&&& success: function (res) {
&&&&&&& var cardList= res.cardL // 用户选中的卡券列表信息
批量添加卡券接口
wx.addCard({
cardList: [{
cardId: '',
cardExt: ''
}], // 需要添加的卡券列表
&&& success: function (res) {
&&&&&&& var cardList = res.cardL // 添加的卡券列表信息
查看微信卡包中的卡券接口
wx.openCard({
cardList: [{
cardId: '',
}]// 需要打开的卡券列表
发起一个微信支付请求
wx.chooseWXPay({
timestamp: 0, // 支付签名时间戳
noncestr: '', // 支付签名随机串
package: '', // 订单详情扩展字符串,详见附录5
paySign: '', // 支付签名,详见附录5
您可能感兴趣的文章:
大家感兴趣的内容
12345678910
最近更新的内容
常用在线小工具废话不说,如上图所示:
1. 关注他人的实现方法很简单,调用weixin协议即可 具体代码如下:
&a href="weixin://profile/gh_xxxxxxxx"&关注他&/a&
这里gh_xxxxxxxx就是用户的原始ID,注意,必须使用原始ID.
2. 分享到朋友圈:
其实利用微信公众账号发布的HTML页面最终是利用微信内置的web浏览器打开的,同时在这个浏览器里集成了WeixinJSBridge这个JS对象,利用这个JS对象的一些操作接口可以实现微信应用内的功能.如添加好友,发送消息等等功能.
01 function ShareTofriends(img_url,link,title,desc) {&
& & & &//在HTML页面内嵌入这一段JS代码
& &if(window.WeixinJSBridge)
相关热词搜索:
上一篇:下一篇:微信分享功能不可用+不能产生回调
之前微信分享一直正常可用,可最近报出微信分享后不能按规定的图片描述链接分享,而且不能产生回调导致不能通过分享增加用户参与活动次数,老代码如下:
document.addEventListener('WeixinJSBridgeReady', function onBridgeReady() {
window.shareData = {
&imgUrl&: &{$shareimg}&,
&timeLineLink&: &{$sharelink}&,
&sendFriendLink&: &{$sharelink}&,
&weiboLink&:
&{$sharelink}&,
&{$sharetitle}&,
&tContent&: &{$sharedesc}&,
&{$sharetitle}&,
&fContent&: &{$sharedesc}&,
&wContent&: &{$sharedesc}&,
/*发送给好友*/
WeixinJSBridge.on('menu:share:appmessage', function (argv) {
WeixinJSBridge.invoke('sendAppMessage', {
&img_url&: window.shareData.imgUrl,
&img_width&: &640&,
&img_height&: &640&,
&link&: window.shareData.sendFriendLink,
&desc&: window.shareData.fContent,
&title&: window.shareData.fTitle
}, function (res) {
if(res.err_msg == 'send_app_msg:ok' || res.err_msg == 'send_app_msg:confirm'){
//转发成功
type: 'POST',
url: &{php echo $this-&createMobileUrl('setadd', array('id' =& $id))}&,
//data: {&id&:0},
dataType: 'json',
success: function(e) {
alert(e.msg);
if (e.success!=0){
$(&#lcount&).text(e.success);
error: function(e, t) {
_report('send_msg', res.err_msg);
//分享到朋友圈
WeixinJSBridge.on('menu:share:timeline', function (argv) {
WeixinJSBridge.invoke('shareTimeline', {
&img_url&: window.shareData.imgUrl,
&img_width&: &640&,
&img_height&: &640&,
&link&: window.shareData.timeLineLink,
&desc&: window.shareData.tContent,
&title&: window.shareData.tTitle
}, function (res) {
if(res.err_msg == 'share_timeline:ok' || res.err_msg == 'share_timeline:confirm'){
//转发成功
type: 'POST',
url: &{php echo $this-&createMobileUrl('setadd', array('id' =& $id))}&,
//data: {&id&:0},
dataType: 'json',
success: function(e) {
alert(e.msg);
if (e.success!=0){
$(&#lcount&).text(e.success);
error: function(e, t) {
_report('timeline', res.err_msg);
//分享到微博
WeixinJSBridge.on('menu:share:weibo', function (argv) {
WeixinJSBridge.invoke('shareWeibo', {
&content&: window.shareData.wContent,
&url&: window.shareData.weiboLink,
}, function (res) {
_report('weibo', res.err_msg);
网上查找资料发现,腾讯为打击诱导分享可能做了一些改动
在github上找到了民间高手发布的weixinAPI,实践证明可用可行,代码如下:
* 微信内置的script API,功能包括:
* 1、分享到微信朋友圈
* 2、分享给微信好友
* 3、分享到腾讯微博
* 4、隐藏/显示右上角的菜单入口
* 5、隐藏/显示底部浏览器工具栏
* 6、获取当前的网络状态
* 7、调起微信客户端的图片播放
* 8、关闭公众平台Web页面
* 9、判断当前网页是否在微信内置浏览器中打开
* 10、支持WeixinApi的错误监控
* 11、发送电子邮件
* 12、禁止用户分享
* @author zhaoxianlie()
(function (window) {
&use strict&;
* 定义WeixinApi
var WeixinApi = {
version: 4.3
// 将WeixinApi暴露到window下:全局可使用,对旧版本向下兼容
window.WeixinApi = WeixinA
/////////////////////////// CommonJS /////////////////////////////////
if (typeof define === 'function' && (define.amd || define.cmd)) {
if (define.amd) {
// AMD 规范,for:requirejs
define(function () {
return WeixinA
} else if (define.cmd) {
// CMD 规范,for:seajs
define(function (require, exports, module) {
module.exports = WeixinA
* 对象简单继承,后面的覆盖前面的,继承深度:deep=1
* @private
var _extend = function () {
var result = {}, obj,
for (var i = 0, len = arguments. i & i++) {
obj = arguments[i];
if (typeof obj === 'object') {
for (k in obj) {
obj[k] && (result[k] = obj[k]);
* 内部私有方法,分享用
* @private
var _share = function (cmd, data, callbacks) {
callbacks = callbacks || {};
// 分享过程中的一些回调
var progress = function (resp) {
switch (true) {
// 用户取消
case /\:cancel$/i.test(resp.err_msg) :
callbacks.cancel && callbacks.cancel(resp);
// 发送成功
case /\:(confirm|ok)$/i.test(resp.err_msg):
callbacks.confirm && callbacks.confirm(resp);
// fail 发送失败
case /\:fail$/i.test(resp.err_msg) :
callbacks.fail && callbacks.fail(resp);
// 无论成功失败都会执行的回调
callbacks.all && callbacks.all(resp);
// 执行分享,并处理结果
var handler = function (theData, argv) {
// 加工一下数据
if (cmd.menu == 'menu:share:timeline' ||
(cmd.menu == 'general:share' && argv.shareTo == 'timeline')) {
var title = theData.
theData.title = theData.desc ||
theData.desc = title || theData.
// 如果是收藏操作,并且在wxCallbacks中配置了favorite为false,则不执行回调
if (argv && (argv.shareTo == 'favorite' || argv.scene == 'favorite')) {
if (callbacks.favorite === false) {
WeixinJSBridge.invoke('sendAppMessage', theData, new Function());
WeixinJSBridge.invoke(cmd.action, theData, progress);
// 新的分享接口,单独处理
if (cmd.menu === 'general:share') {
if (argv.shareTo === 'timeline') {
WeixinJSBridge.invoke('shareTimeline', theData, progress);
} else if (argv.shareTo === 'friend') {
WeixinJSBridge.invoke('sendAppMessage', theData, progress);
} else if (argv.shareTo === 'QQ') {
WeixinJSBridge.invoke('shareQQ', theData, progress);
} else if (argv.shareTo === 'weibo') {
WeixinJSBridge.invoke('shareWeibo', theData, progress);
WeixinJSBridge.invoke(cmd.action, theData, progress);
// 监听分享操作
WeixinJSBridge.on(cmd.menu, function (argv) {
callbacks.dataLoaded = callbacks.dataLoaded || new Function();
if (callbacks.async && callbacks.ready) {
WeixinApi[&_wx_loadedCb_&] = callbacks.dataL
if (WeixinApi[&_wx_loadedCb_&].toString().indexOf(&_wx_loadedCb_&) & 0) {
WeixinApi[&_wx_loadedCb_&] = new Function();
callbacks.dataLoaded = function (newData) {
callbacks.__cbkCalled =
var theData = _extend(data, newData);
theData.img_url = theData.imgUrl || theData.img_
delete theData.imgU
WeixinApi[&_wx_loadedCb_&](theData);
handler(theData, argv);
// 然后就绪
if (!(argv && (argv.shareTo == 'favorite' || argv.scene == 'favorite') && callbacks.favorite === false)) {
callbacks.ready && callbacks.ready(argv, data);
// 如果设置了async为true,但是在ready方法中并没有手动调用dataLoaded方法,则自动触发一次
if (!callbacks.__cbkCalled) {
callbacks.dataLoaded({});
callbacks.__cbkCalled =
// 就绪状态
var theData = _extend(data);
if (!(argv && (argv.shareTo == 'favorite' || argv.scene == 'favorite') && callbacks.favorite === false)) {
callbacks.ready && callbacks.ready(argv, theData);
handler(theData, argv);
* 分享到微信朋友圈
待分享的信息
* @p-config
公众平台的appId(服务号可用)
* @p-config
* @p-config
* @p-config
* @p-config
分享的标题
相关回调方法
* @p-config
ready方法是否需要异步执行,默认false
* @p-config
{Function}
ready(argv, data)
* @p-config
{Function}
dataLoaded(data)
数据加载完成后调用,async为true时有用,也可以为空
* @p-config
{Function}
cancel(resp)
* @p-config
{Function}
fail(resp)
* @p-config
{Function}
confirm(resp)
* @p-config
{Function}
无论成功失败都会执行的回调
WeixinApi.shareToTimeline = function (data, callbacks) {
menu: 'menu:share:timeline',
action: 'shareTimeline'
&appid&: data.appId ? data.appId : '',
&img_url&: data.imgUrl,
&link&: data.link,
&desc&: data.desc,
&title&: data.title,
&img_width&: &640&,
&img_height&: &640&
}, callbacks);
* 发送给微信上的好友
待分享的信息
* @p-config
公众平台的appId(服务号可用)
* @p-config
* @p-config
* @p-config
* @p-config
分享的标题
相关回调方法
* @p-config
ready方法是否需要异步执行,默认false
* @p-config
{Function}
ready(argv, data)
* @p-config
{Function}
dataLoaded(data)
数据加载完成后调用,async为true时有用,也可以为空
* @p-config
{Function}
cancel(resp)
* @p-config
{Function}
fail(resp)
* @p-config
{Function}
confirm(resp)
* @p-config
{Function}
无论成功失败都会执行的回调
WeixinApi.shareToFriend = function (data, callbacks) {
menu: 'menu:share:appmessage',
action: 'sendAppMessage'
&appid&: data.appId ? data.appId : '',
&img_url&: data.imgUrl,
&link&: data.link,
&desc&: data.desc,
&title&: data.title,
&img_width&: &640&,
&img_height&: &640&
}, callbacks);
* 分享到腾讯微博
待分享的信息
* @p-config
* @p-config
相关回调方法
* @p-config
ready方法是否需要异步执行,默认false
* @p-config
{Function}
ready(argv, data)
* @p-config
{Function}
dataLoaded(data)
数据加载完成后调用,async为true时有用,也可以为空
* @p-config
{Function}
cancel(resp)
* @p-config
{Function}
fail(resp)
* @p-config
{Function}
confirm(resp)
* @p-config
{Function}
无论成功失败都会执行的回调
WeixinApi.shareToWeibo = function (data, callbacks) {
menu: 'menu:share:weibo',
action: 'shareWeibo'
&content&: data.desc,
&url&: data.link
}, callbacks);
* 新的分享接口
待分享的信息
* @p-config
公众平台的appId(服务号可用)
* @p-config
* @p-config
* @p-config
* @p-config
分享的标题
相关回调方法
* @p-config
ready方法是否需要异步执行,默认false
* @p-config
{Function}
ready(argv, data)
* @p-config
{Function}
dataLoaded(data)
数据加载完成后调用,async为true时有用,也可以为空
* @p-config
{Function}
cancel(resp)
* @p-config
{Function}
fail(resp)
* @p-config
{Function}
confirm(resp)
* @p-config
{Function}
无论成功失败都会执行的回调
WeixinApi.generalShare = function (data, callbacks) {
menu: 'general:share'
&appid&: data.appId ? data.appId : '',
&img_url&: data.imgUrl,
&link&: data.link,
&desc&: data.desc,
&title&: data.title,
&img_width&: &640&,
&img_height&: &640&
}, callbacks);
* 设置页面禁止分享:包括朋友圈、好友、腾讯微博、qq
* @param callback
WeixinApi.disabledShare = function (callback) {
callback = callback || function () {
alert('当前页面禁止分享!');
['menu:share:timeline', 'menu:share:appmessage', 'menu:share:qq',
'menu:share:weibo', 'general:share'].forEach(function (menu) {
WeixinJSBridge.on(menu, function () {
callback();
* 调起微信Native的图片播放组件。
* 这里必须对参数进行强检测,如果参数不合法,直接会导致微信客户端crash
* @param {String} curSrc 当前播放的图片地址
* @param {Array} srcList 图片地址列表
WeixinApi.imagePreview = function (curSrc, srcList) {
if (!curSrc || !srcList || srcList.length == 0) {
WeixinJSBridge.invoke('imagePreview', {
'current': curSrc,
'urls': srcList
* 显示网页右上角的按钮
WeixinApi.showOptionMenu = function () {
WeixinJSBridge.call('showOptionMenu');
* 隐藏网页右上角的按钮
WeixinApi.hideOptionMenu = function () {
WeixinJSBridge.call('hideOptionMenu');
* 显示底部工具栏
WeixinApi.showToolbar = function () {
WeixinJSBridge.call('showToolbar');
* 隐藏底部工具栏
WeixinApi.hideToolbar = function () {
WeixinJSBridge.call('hideToolbar');
* 返回如下几种类型:
* network_type:wifi
* network_type:edge
非wifi,包含3G/2G
* network_type:fail
网络断开连接
* network_type:wwan
* 使用方法:
* WeixinApi.getNetworkType(function(networkType){
* @param callback
WeixinApi.getNetworkType = function (callback) {
if (callback && typeof callback == 'function') {
WeixinJSBridge.invoke('getNetworkType', {}, function (e) {
// 在这里拿到e.err_msg,这里面就包含了所有的网络类型
callback(e.err_msg);
* 关闭当前微信公众平台页面
* @p-config
{Function}
fail(resp)
* @p-config
{Function}
success(resp)
WeixinApi.closeWindow = function (callbacks) {
callbacks = callbacks || {};
WeixinJSBridge.invoke(&closeWindow&, {}, function (resp) {
switch (resp.err_msg) {
// 关闭成功
case 'close_window:ok':
callbacks.success && callbacks.success(resp);
// 关闭失败
callbacks.fail && callbacks.fail(resp);
* 当页面加载完毕后执行,使用方法:
* WeixinApi.ready(function(Api){
// 从这里只用Api即是WeixinApi
* @param readyCallback
WeixinApi.ready = function (readyCallback) {
* 加一个钩子,同时解决和iOS下的分享问题
* @private
var _hook = function () {
var _WeixinJSBridge = {};
Object.keys(WeixinJSBridge).forEach(function (key) {
_WeixinJSBridge[key] = WeixinJSBridge[key];
Object.keys(WeixinJSBridge).forEach(function (key) {
if (typeof WeixinJSBridge[key] === 'function') {
WeixinJSBridge[key] = function () {
var args = arguments.length & 0 ? arguments[0] : {},
runOn3rd_apis = args.__params ? args.__params.__runOn3rd_apis || [] : [];
['menu:share:timeline', 'menu:share:appmessage', 'menu:share:weibo',
'menu:share:qq', 'general:share'].forEach(function (menu) {
runOn3rd_apis.indexOf(menu) === -1 && runOn3rd_apis.push(menu);
} catch (e) {
return _WeixinJSBridge[key].apply(WeixinJSBridge, arguments);
if (readyCallback && typeof readyCallback == 'function') {
var wxReadyFunc = function () {
readyCallback(Api);
if (typeof window.WeixinJSBridge == &undefined&) {
if (document.addEventListener) {
document.addEventListener('WeixinJSBridgeReady', wxReadyFunc, false);
} else if (document.attachEvent) {
document.attachEvent('WeixinJSBridgeReady', wxReadyFunc);
document.attachEvent('onWeixinJSBridgeReady', wxReadyFunc);
wxReadyFunc();
* 判断当前网页是否在微信内置浏览器中打开
WeixinApi.openInWeixin = function () {
return /MicroMessenger/i.test(navigator.userAgent);
* 发送邮件
邮件初始内容
* @p-config
* @p-config
相关回调方法
* @p-config
{Function}
fail(resp)
* @p-config
{Function}
success(resp)
* @p-config
{Function}
无论成功失败都会执行的回调
WeixinApi.sendEmail = function (data, callbacks) {
callbacks = callbacks || {};
WeixinJSBridge.invoke(&sendEmail&, {
&title&: data.subject,
&content&: data.body
}, function (resp) {
if (resp.err_msg === 'send_email:sent') {
callbacks.success && callbacks.success(resp);
callbacks.fail && callbacks.fail(resp);
callbacks.all && callbacks.all(resp);
* 开启Api的debug模式,比如出了个什么错误,能alert告诉你,而不是一直很苦逼的在想哪儿出问题了
{Function}
callback(error) 出错后的回调,默认是alert
WeixinApi.enableDebugMode = function (callback) {
* @param {String}
errorMessage
* @param {String}
出错的文件
* @param {Long}
lineNumber
出错代码的行号
* @param {Long}
columnNumber
出错代码的列号
window.onerror = function (errorMessage, scriptURI, lineNumber, columnNumber) {
// 有callback的情况下,将错误信息传递到options.callback中
if (typeof callback === 'function') {
callback({
message: errorMessage,
script: scriptURI,
line: lineNumber,
column: columnNumber
// 其他情况,都以alert方式直接提示错误信息
var msgs = [];
msgs.push(&额,代码有错。。。&);
msgs.push(&\n错误信息:&, errorMessage);
msgs.push(&\n出错文件:&, scriptURI);
msgs.push(&\n出错位置:&, lineNumber + '行,' + columnNumber + '列');
alert(msgs.join(''));
* 通用分享,一种简便的写法
* @param wxData
* @param wxCallbacks
WeixinApi.share = function (wxData, wxCallbacks) {
WeixinApi.ready(function (Api) {
// 用户点开右上角popup菜单后,点击分享给好友,会执行下面这个代码
Api.shareToFriend(wxData, wxCallbacks);
// 点击分享到朋友圈,会执行下面这个代码
Api.shareToTimeline(wxData, wxCallbacks);
// 点击分享到腾讯微博,会执行下面这个代码
Api.shareToWeibo(wxData, wxCallbacks);
// 分享到各渠道
Api.generalShare(wxData, wxCallbacks);
})(window);
加入了share.js后,可以通过WeixinApi.ready()来完成分享功能
// 需要分享的内容,请放到ready里
WeixinApi.ready(function(Api) {
// 微信分享的数据
var wxData = {
&imgUrl&: &{$shareimg}&,
&link& : &{$sharelink}&,
&desc& : &{$sharedesc}&,
&title& : &{$sharetitle}&
// 分享的回调
var wxCallbacks = {
// 收藏操作是否触发回调,默认是开启的
favorite : false,
// 分享操作开始之前
ready : function() {
// 你可以在这里对分享的数据进行重组
// 分享被用户自动取消
cancel : function(resp) {
// 你可以在你的页面上给用户一个小Tip,为什么要取消呢?
// 分享失败了
fail : function(resp) {
// 分享失败了,是不是可以告诉用户:不要紧,可能是网络问题,一会儿再试试?
// 分享成功
confirm : function(resp) {
// 分享成功了,我们是不是可以做一些分享统计呢?
//转发成功
type: 'POST',
url: &{php echo $this-&createMobileUrl('setadd', array('id' =& $id))}&,
//data: {&id&:0},
dataType: 'json',
success: function(e) {
alert(e.msg);
if (e.success!=0){
$(&#lcount&).text(e.success);
error: function(e, t) {
// 整个分享过程结束
all : function(resp,shareTo) {
// 如果你做的是一个鼓励用户进行分享的产品,在这里是不是可以给用户一些反馈了?
// 用户点开右上角popup菜单后,点击分享给好友,会执行下面这个代码
Api.shareToFriend(wxData, wxCallbacks);
// 点击分享到朋友圈,会执行下面这个代码
Api.shareToTimeline(wxData, wxCallbacks);
// 点击分享到腾讯微博,会执行下面这个代码
Api.shareToWeibo(wxData, wxCallbacks);
// iOS上,可以直接调用这个API进行分享,一句话搞定
Api.generalShare(wxData,wxCallbacks);
回调里面控制了分享过程中的各个流程
(window.slotbydup=window.slotbydup || []).push({
id: '2467140',
container: s,
size: '1000,90',
display: 'inlay-fix'
(window.slotbydup=window.slotbydup || []).push({
id: '2467141',
container: s,
size: '1000,90',
display: 'inlay-fix'
(window.slotbydup=window.slotbydup || []).push({
id: '2467142',
container: s,
size: '1000,90',
display: 'inlay-fix'
(window.slotbydup=window.slotbydup || []).push({
id: '2467143',
container: s,
size: '1000,90',
display: 'inlay-fix'
(window.slotbydup=window.slotbydup || []).push({
id: '2467148',
container: s,
size: '1000,90',
display: 'inlay-fix'

我要回帖

更多关于 网页按钮点击没反应 的文章

 

随机推荐