Twitter数据文本属性未使用jQuery设置(Twitter data

Twitter数据文本属性未使用jQuery设置(Twitter data-text attribute is not set using jQuery)

我正在使用Twitter上的以下按钮发推特。

<a id="tweet" href="https://twitter.com/share" class="twitter-share-button" data-text="Husam" data-size="large" data-count="none">Tweet it!</a> <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs'); </script>

在我的JS文件中，我正在尝试使用jQuery attr函数更改数据文本属性，以便它推送我想要推文的内容。

$("#tweet").attr("data-text","what I want to tweet");

它只是没有按预期工作，我无法更改数据文本属性。 有任何想法吗？

你可以在这里看到代码： http ： //codepen.io/husamp/pen/YyKLze

I'm using the following button from Twitter to tweet something.

<a id="tweet" href="https://twitter.com/share" class="twitter-share-button" data-text="Husam" data-size="large" data-count="none">Tweet it!</a> <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs'); </script>

In my JS file, I'm trying to change data-text attribute using jQuery attr function, so that it tweets what I would like to tweet.

$("#tweet").attr("data-text","what I want to tweet");

It just doesn't work as expected, I can't change the data-text attribute. Any ideas?

You can see the code here: http://codepen.io/husamp/pen/YyKLze

最满意答案

我认为正在发生的是当评估Twitter JavaScript时， <a id="tweet" ...被替换为iFrame，因此你的$(#tweet)实际上不会找到任何元素，所以没有设置数据属性。

查看推文按钮参考，并考虑每次引用更改时使用JavaScript工厂示例重新创建推文按钮。

来自twitter的示例代码是：

twttr.widgets.createShareButton(    "https:\/\/dev.twitter.com\/web\/tweet-button",    document.getElementById("tweet-container"),    {      size: "large",      via: "twitterdev",      related: "twitterapi,twitter",      text: "PUT UPDATED SHARE TEXT HERE",      hashtags: "example,demo"    } );

因此，在引用更改时，您需要清除旧的tweet按钮，然后将新的按钮插入#tweet-container

I think what's happening is the <a id="tweet" ... is replaced with an iFrame when the Twitter JavaScript is evaluated so your $(#tweet) won't actually find any elements so no data attribute is set.

Have a look at the Tweet Button Reference and consider using the JavaScript Factory Example to re-create a tweet button every time your quote changes.

The example code from twitter is:

twttr.widgets.createShareButton(    "https:\/\/dev.twitter.com\/web\/tweet-button",    document.getElementById("tweet-container"),    {      size: "large",      via: "twitterdev",      related: "twitterapi,twitter",      text: "PUT UPDATED SHARE TEXT HERE",      hashtags: "example,demo"    } );

So on quote change, you'd need to clear the old tweet button and then insert a new one into #tweet-container