RT:

一、 手Q分享：

如下代码所示：设置好 description，name,image,即可，唯一注意的是image最好是200*200，要不然过小不美观，过大加载太慢

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">

    <meta itemprop="name" content="我邀请您加入">

    <meta itemprop="description" content="我们都在用轻松发呗，工资、考核等信息及时送达，方便快捷又安全，赶紧用起来吧。">

    <meta itemprop="image" content="http://www.zhidianbao.cn/fbwap-test/wap/images/fblogo.png">

</head>

二、 微信分享：

1. 主要是依赖于微信的JS-JDK，

"http://res.wx.qq.com/open/js/jweixin-1.0.0.js",
判断页面是否是微信内置浏览器
function isWeiXin(){

    var ua = window.navigator.userAgent.toLowerCase();

    if(ua.match(/MicroMessenger/i) == 'micromessenger'){

        return true;

    }else{

        return false;

    }

}

 if (isWeiXin()) {//升级上去使用此方法   授权地址只能是无端口号的完整域名 本地有端口映射的无法直接调试 微信

            $LAB.script([

                "http://res.wx.qq.com/open/js/jweixin-1.0.0.js",

                "js/wxshareload.js"

            ]).wait(function () {

            });

      }

　2.　引入的 wxshareload.js，如下所示

//需要调用接口

var jsApiList = ['onMenuShareTimeline',

      'onMenuShareAppMessage',

      'onMenuShareQQ',

      'onMenuShareWeibo'

];

var linkurl = window.location.href;//分享跳转连接

var fx_title=document.title;//标题

var fx_desc = " 这里输入标书";//描述

var fx_imgUrl="http://www.xxxx.cn//xx.png";//分享图片

//分享内容修改

//这个地方是需要从服务端获取微信的相关配置信息的

wxconfset(ding_conf);

function wxconfset(ding_conf){

  wx.config({

            debug: false,

            appId:ding_conf.appId, //微信公众号的appId

            timestamp:ding_conf.timeStamp,//微信公众号的timeStamp

            nonceStr:ding_conf.nonceStr,微信公众号nonceStr

            signature:ding_conf.signature,微信公众号signature

            jsApiList:jsApiList

  });

  wx.error(function(res){

//      alert("验证失败"  +JSON.stringify(res));

  });

  /*--------------------分享定义----------------*/

  wx.ready(function () {

      var shareData={

      title:fx_title,

      desc:fx_desc,

      link:linkurl,

      imgUrl:fx_imgUrl

      };

      wx.onMenuShareTimeline({

              title: shareData.title,

              link: shareData.link,

              imgUrl: shareData.imgUrl,

              trigger: function (res) {

              },

              success: function (){

//                      alert('分享成功！');

              },

              cancel: function () {

              },

              fail: function (res) {

                      alert(JSON.stringify(res));

              }

      });

      wx.onMenuShareAppMessage({

          title: shareData.title,

          desc: shareData.desc,

          link: shareData.link,

          imgUrl: shareData.imgUrl,

          trigger: function (res) {

          },

          success: function (){

//              alert('分享成功！');

          },

          cancel: function () {

//              alert('取消分享！');

          },

          fail: function (res) {

              alert(JSON.stringify(res));

          }

      });

      wx.onMenuShareQQ({

          title: shareData.title,

          link: shareData.link,

          desc: shareData.desc,

          imgUrl: shareData.imgUrl,

          trigger: function (res) {

          },

          complete: function (res) {

//              alert(JSON.stringify(res));

          },

          success: function (res) {

          },

          cancel: function (res) {

//              alert('已取消');

          },

          fail: function (res) {

//              alert(JSON.stringify(res));

          }

      });

      wx.onMenuShareWeibo({

          title: shareData.title,

          link: shareData.link,

          desc: shareData.desc,

          imgUrl: shareData.imgUrl,

          trigger: function (res) {

          },

          success: function (){

//              alert('分享成功！');

          },

          cancel: function () {

//              alert('取消分享！');

          },

          fail: function (res) {

              alert(JSON.stringify(res));

          }

      });

     })

}

至此完成，这虽然只是H5的分享的一些东西，百度也能找到，零零总总的自己总结下，还是能省下不少功夫吧！

H5页面微信分享和手Q分享设置的更多相关文章

  1. 自定义页面微信、微博、QQ分享效果

    几行简单的分享代码既可以实现,先看下效果: 第一步:页面因为结构代码 <div id="freebtn"> <ul> <li class=" ...

  2. 移动H5页面微信支付踩坑之旅（微信支付、单页面路由模拟、按钮加锁、轮询等常见功能）

    开发背景: .net混合开发的vue模板语法的单页面应用,所以不存在脚手架以及没有路由可以跳转. 项目描述: 需要写两个页面,在订单详情页需要点击“请输入手机号”进入手机号绑定页面,手机号绑定成功后自 ...

  3. iOS 和 H5 页面交互（WKWebview 和 UIWebview cookie 设置）

    iOS 和 H5 页面交互(WKWebview 和 UIWebview cookie 设置) 主要记录关于cookie相关的坑 1. UIWebview 1. UIWebview 相对比较简单 直接通 ...

  4. 如何判断一个 APP页面是否是H5页面

    1.无网络断开网络,显示404或则错误页面的是H5 2.页面布局a.在手机设置.开发者选项中开启显示布局边界功能:b.进入应用查看布局边界:c.原生应用可以看到各个控件的布局边界,H5只有整个页面的一 ...

  5. 如何判断一个 APP页面是否是H5页面（转载）

    1.无网络断开网络,显示404或则错误页面的是H5 2.页面布局a.在手机设置.开发者选项中开启显示布局边界功能:b.进入应用查看布局边界:c.原生应用可以看到各个控件的布局边界,H5只有整个页面的一 ...

  6. robotframework_如何用Chrome模拟手机打开H5页面

    由于公司目前的产品大部分都是APP端的H5页面,APP原生页面很少,测试H5页面如果去搭建appium或者macaca这类自动化平台太费时,太重而不能快速落地:与自动化的目标:提高测试效率相悖.但如果 ...

  7. 微信小程序内联h5页面，实现分享

    在小程序内直联h5的页面(pages/webview/webview.js),该页面为<web-view>的容器,使用<web-view>组件 <web-view wx: ...

  8. H5 页面在微信端的分享

    微信分享,咋一看好像很复杂,实则非常简单.只需要调用微信官方出的微信jssdk,加上些许配置,就可以实现h5页面在微信上的分享,官方文档地址为: https://mp.weixin.qq.com/wi ...

  9. js-禁止微信H5页面点击右上角菜单时出现“复制链接”，且分享仅支持微信分享

    禁止微信H5页面点击右上角菜单时出现“复制链接”,这个问题已经影响到我很久很久了,起码有2年了, 昨天写H5活动的时候,需求有一个是:可分享,但是禁止复制活动链接, 这一下,就逼我务必好好研究研究了. ...

随机推荐

  1. LINQ系列目录

    1. LINQ准备 1.1 C#中与LINQ相关特性 2. LINQ to Object 2.1 LINQ to Object投影操作符(Select/SelectMany/Let) 2.2 LINQ ...

  2. 纪录我的iOS学习之路

    学习资料的网址 田伟宇(Casa Taloyum)有几篇介绍iOS架构的文章,一级棒!原博客链接. iOS应用架构谈 开篇 iOS应用架构谈 view层的组织和调用方案 iOS应用架构谈 网络层设计方 ...

  3. MVC5 网站开发之三 数据存储层功能实现

    数据存储层在项目Ninesky.DataLibrary中实现,整个项目只有一个类Repository.   目录 奔跑吧,代码小哥! MVC5网站开发之一 总体概述 MVC5 网站开发之二 创建项目 ...

  4. MVC5 网站开发之五 展示层架构

    展示层由Ninesky.Web项目实现,负责网站内容的显示,项目包含Member和Control两个区域.   目录 奔跑吧,代码小哥! MVC5网站开发之一 总体概述 MVC5 网站开发之二 创建项 ...

  5. 从零开始编写自己的C#框架（16）——Web层后端父类

    本章节讲述的各个类是后端系统的核心之一,涉及到系统安全验证.操作日志记录.页面与按键权限控制.后端页面功能封装等内容,希望学习本系列的朋友认真查看新增的类与函数,这对以后使用本框架进行开发时非常重要. ...

  6. CSS笔记总结

    1.让页面里的字体变清晰和变细 -webkit-font-smoothing: antialiased; 2.让Chrome支持小于12px 的文字 -webkit-text-size-adjust: ...

  7. Nginx最大客户连接数算法一些遐想

    Nginx最大客户连接数算法一些遐想 现在很多互联网公司都在使用nginx,并且替换掉以前的Apache,nginx的优点就不说了,浅聊两句nginx的某些配置参数,找到这些参数设置的目的和关联性,并 ...

  8. 前端开发：css技巧，如何设置select、radio 、 checkbox 、file这些不可直接设置的样式 。

    前言: 都说程序员有三宝:人傻,钱多,死得早.博主身边的程序“猿”一大半应了这三宝,这从侧面说明了一个问题,只有理性是过不好日子的.朋友们应该把工作与生活分开,让生活变得感性,让工作变得理性,两者相提 ...

  9. WPF绑定到集合

    什么是集合视图? 集合视图是位于绑定源集合顶部的一层,您可以通过它使用排序.筛选和分组查询来导航和显示源集合,而无需更改基础源集合本身.集合视图还维护着一个指向集合中的当前项的指针.如果源集合实现了 ...

  10. 两种常用的C语言排序算法

    1. 要求输入10个整数,从大到小排序输出 输入:2 0 3 -4 8 9 5 1 7 6 输出:9 8 7 6 5 3 2 1 0 -4 解决方法:选择排序法 实现代码如下: #include &l ...