Question

我目前在我正在创建的社交网络小部件上有一个包含Google Share按钮（以及Facebook和Twitter）的网站。我想要做的是能够在textarea字段中键入一些文本，并在按下“发送”按钮后，文本将共享给Google+用户的墙（我已经有Facebook和Twitter帖子工作）。现在我知道Google +的分享按钮有一个名为'data-prefilltext'的字段，这是我试图用来自textarea的消息设置的字段。当我按下“发送”按钮时，我可以看到'data-prefilltext'字段值更改，但在弹出窗口中，我看不到文本更改。以下是代码：

HTML：

<div id="googleplus-selector" title="App is what's new! Share it with your circles in Google+"
    class="social-networking-icons g-interactivepost"
    data-contenturl="http://plus.google.com/pages/"
    data-contentdeeplinkid="/pages"
    data-clientid="clientid.apps.googleusercontent.com"
    data-scope="https://www.googleapis.com/auth/youtube.readonly"
    data-cookiepolicy="single_host_origin"
    data-prefilltext="Share App with your circle of friends now!"
    data-calltoactionlabel="TRY_IT"
    data-calltoactionurl="http://plus.google.com/pages/"
    data-calltoactiondeeplinkid="/pages/create"
    data-href="http://mysiteurl">
        <div class="widget-mask"></div>
</div>

的Javascript / jQuery的：

var textElement = $('#social-message-text');
var text = textElement.val();
$('#google-plus-share-button').attr('data-prefilltext', text);

就像我说的那样，我可以通过检查Firebug或Google的开发者控制台中的元素来查看属性的值更改，但是当打开Google共享弹出窗口时，文本中的更改不会反映出来。

任何帮助都会非常感激，因为我现在有点难过。提前感谢大家。

Answer 1

我也遇到了同样的问题。经过长时间的努力，我找到了解决方案。我正在与你分享答案。

<html>
  <head>
    <title>Share Demo: Deferred execution with language code</title>
    <link rel="canonical" href="http://www.example.com" />
  </head>
  <body>
  <script>
  window.___gcfg = {
            lang: 'en-US',
            parsetags: 'explicit'
          };
  </script>
  <script type="text/javascript" src="http://apis.google.com/js/plusone.js"></script>
    <div id ="sharePost">Share</div>
 <script>
     (function() {
           var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
           po.src = 'http://apis.google.com/js/client:plusone.js';
           var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
         })();
     var options = {
                contenturl: 'http://www.google.com',
                contentdeeplinkid: '/pages',
                clientid: 'xxxxxxxxxxxxx.apps.googleusercontent.com',
                cookiepolicy: 'single_host_origin',
                prefilltext: 'Hai happy friday',
                calltoactionlabel: 'INVITE',
                calltoactionurl: 'http://www.google.com'
              };
              // Call the render method when appropriate within your app to display
              // the button.
              gapi.interactivepost.render('sharePost', options);

      </script>
  </body>
</html>

当你收到来自ajax的回复时，你必须在ajax响应后再次调用google plus share js文件。

Answer 2

您可以使用javascript渲染按钮，下一个代码示例：

var options = {
                contenturl: 'https://dev.diesocialisten.at/google+/?v=5',
                clientid: 'YOUR CLIENT ID',
                cookiepolicy: 'single_host_origin',
                prefilltext: 'Developers, you should check this out!',
                calltoactionlabel: 'LEARN_MORE',
                calltoactionurl: 'https://dev.diesocialisten.at/google+/?v=5'
};
gapi.interactivepost.render('share-button', options); //button with the ID share-button

Google Share按钮动态设置data-prefilltext

2 个答案: