接着上篇讲,上篇讲了如何分享到facebook,这篇我们讲一下如何分享到twitter和Email,首先分享到twitter和Email不像分享到facebook一样可以有回调,这两分享是没有回调的,分享成功失败,也不知道,但是会触发事件.
我们先来看下分享到twitter,首先引入twitter的sdk文件,如下图所示:
window.twttr = (function (d, s, id) {// 引入sdkvar t, js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) return;js = d.createElement(s);js.id = id;js.src = "/widgets.js";fjs.parentNode.insertBefore(js, fjs);return window.twttr || (t = {_e: [], ready: function(f){t._e.push(f) } });}(document, "script", "twitter-wjs"));try {twttr.ready(function (twttr) {// 注册事件twttr.events.bind('tweet', function (event) {// your callback action here...console.log('callback')});});} catch (err) {new Error('twttr fail to load')}// 分享事件开始$('.share_tweet').on('click', function() {var text = '8%E6%9C%8817%E6%' // 携带文本需要通过url转码,如果不是标准转码可能会导致分享内容乱码(像中文、日文这种文本)$(this).parent().attr('target', '_blank');$(this).parent().attr('href', '/share?text='+ text +'&url=https://www.xxx.jp');})
效果图如下所示
2.Javascript如何将内容分享到Email呢?我们知道分享到facebook或者twitter是将分享的内容通过a标签href属性带出去的,跳转到三方网站接收到URL的参数就会生成相对应的内容,其实分享到Email也是通过href的属性去调取底层的api接口实现的,href的参数上带上mailto就可以调取邮件客户端,具体可携带的参数总共mailto,cc,bcc,subject,body五个,有些客户端支持自定义的属性,有些客户端会过滤掉自定义的属性;代码如下图所示:
// html<a class='my-href'>click</a>// jsvar email_url = ''; // 后端返回的需要动态添加邮件文本内容var email_content = ''; // 后端返回的静态内容var email_context = ''; // 邮件须发送的文本email_context = email_content + encodeURIComponent(email_url); // 通过url调取需要进行url转码,不然通过url解码之后会乱码$('.my-href'').attr('href', 'mailto:?body=' + email_context);
附上国外一篇博文参考地址:
全篇完~
