未使用 jQuery 设置 Twitter 数据文本属性答案

【问题标题】：Twitter data-text attribute is not set using jQuery未使用 jQuery 设置 Twitter 数据文本属性
【发布时间】：2015-09-04 00:13:50
【问题描述】：

我正在使用 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 函数更改 data-text 属性，以便它发布我想要发布的内容。

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

它只是没有按预期工作，我无法更改 data-text 属性。有什么想法吗？

您可以在此处查看代码：http://codepen.io/husamp/pen/YyKLze

【问题讨论】：

在检查元素 #tweet 时尝试使用 $("#tweet").data('text', 'what you want to tweet')，属性数据文本不会显示。但是当你使用：$('#tweet').data('text') 请求它时，你会看到“你想发什么推文”。

标签： javascript jquery twitter

【解决方案1】：

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

查看Tweet Button Reference，并考虑在每次报价更改时使用 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-container 中插入一个新按钮

【讨论】：

【解决方案2】：

您可以使用https://api.jquery.com/data/获取和设置数据值

设置值

$('#tweet').data('text', 'what I want to tweet');

获取价值

$('#tweet').data('text');

【讨论】：