拍摄使用jQuery的Twitter的“分享Tweet”按钮的点击(capture the clic

2019-06-26 16:50发布

我有我的网站上,当它访问Twitter的API生成它自己的标记,其下面的代码。

我期待呼吁JavaScript函数onClick即使这一点,但,但作为标记的变化,似乎它不是仅仅增加一个简单onClick到锚。

我怎样才能捕捉到“分享Tweet”按钮的点击?

<div class="social_button twitter_button">
  <a href="https://twitter.com/share" class="twitter-share-button" data-count="horizontal">
    Tweet
  </a>
  <script type="text/javascript" src="//platform.twitter.com/widgets.js"></script>
</div>

Answer 1:

你不能处理点击事件,此元素,因为它是在一个iFrame,但Twitter的为您提供了事件绑定到该按钮的机会。

例如: http://jsfiddle.net/ZwHBf/2/文档: https://dev.twitter.com/docs/intents/events

代码:HTML:

<div class="social_button twitter_button">
    <div id="foo">
        <a href="https://google.com" class="twitter-share-button" data-count="horizontal">
    Tweet
  </a>
    </div>
    <script type="text/javascript" src="//platform.twitter.com/widgets.js"></script>
    <script type="text/javascript" charset="utf-8">
        window.twttr = (function (d, s, id) {
            var t, js, fjs = d.getElementsByTagName(s)[0];
            if (d.getElementById(id)) return;
            js = d.createElement(s);
            js.id = id;
            js.src = "//platform.twitter.com/widgets.js";
            fjs.parentNode.insertBefore(js, fjs);
            return window.twttr || (t = {
                _e: [],
                ready: function (f) {
                    t._e.push(f)
                }
            });
        }(document, "script", "twitter-wjs"));
    </script>
</div>​

JS:

twttr.events.bind('click', function(event) {
    console.log('clicked');
});​


Answer 2:

添加定制的Twitter按钮,您的网站是比你想象的要容易得多。

<a href="http://twitter.com/share">Tweet</a>

是的,真的,这一切都需要。 给你链接的一些设计的热爱和多田! 你自己定制的Twitter按钮。

打开Twitter共享框在一个弹出窗口

要显示Twitter共享盒作为一个弹出,只需添加JavaScript的一些行来打开一个新窗口的链接。 下面是使用jQuery的例子:

<a class="twitter popup" href="http://twitter.com/share">Tweet</a>

<script>
  $('.popup').click(function(event) {
    var width  = 575,
        height = 400,
        left   = ($(window).width()  - width)  / 2,
        top    = ($(window).height() - height) / 2,
        url    = this.href,
        opts   = 'status=1' +
                 ',width='  + width  +
                 ',height=' + height +
                 ',top='    + top    +
                 ',left='   + left;

    window.open(url, 'twitter', opts);

    return false;
  });
</script>

注意:这只是一个例子。 你可能希望把JavaScript代码.js文件并调用它的文件准备好。

$(document).ready(function() {
  $('.popup').click(function(event) {
    // and so on...
  }
});

设置一个默认的消息鸣叫

您可以设置鸣叫添加一个文本参数链接默认文本:

<a class="twitter popup" href="http://twitter.com/share?text=This%20is%20so%20easy">Tweet</a>

现在,当你的用户在你的资料Tweet点击链接,消息“这是很容易的”将出现在默认的鸣叫箱。 更多..



Answer 3:

您可以使用jQuery尝试...

<script>
        $(document).ready(function(){
    $(".twitter-share-button").on("click",function(){
        // do something
        });
    });
</script>

我怀疑即使标记修改类会改变。



文章来源: capture the click of the Twitter “Tweet” button using jQuery