javascript - 重新创建或更改推特按钮的参数

Question

我有一个带有 Twitter 按钮的页面。在那个推特按钮之前，我有一个输入字段和一个表单，可以轻松添加该页面的相关主题标签。目的是将输入字段的文本带到推特上。所以它在 twitter 对话框的输入字段中。

所以我有以下代码来显示按钮，取自 twitter 文档:

<a  href="https://twitter.com/share" 
    class="twitter-share-button" data-lang="en"
data-size="large" 
    data-count="none"
data-text="BLA"
id="tweetbutton">Tweet</a>

    <script>!function(d,s,id){
        var js,fjs=d.getElementsByTagName(s)[0];
        if(!d.getElementById(id)){
                js=d.createElement(s);
                js.id=id;
                js.src="https://platform.twitter.com/widgets.js";                               
                fjs.parentNode.insertBefore(js,fjs);
            }
    }
    (document,"script","twitter-wjs");
    </script>

(我输入了“BLA”作为文本，只是为了测试)

因此，当我的输入字段的值发生变化时，我会执行以下操作:

<script language="javascript" type="text/javascript">
   function appendTag(tag) {    
   var newValue = $('#bericht').val() + tag;        
   $('#tweetbutton').attr('data-text', newValue);

   twttr.widgets.load();                
}
</script>

在文档中我读到“twttr.widgets.load();”应该重新创建按钮。但它不会那样做。我还尝试添加行“(文档，”脚本“，”twitter-wjs“)；”在我的功能之下，但它并没有改变行为。

有没有正确的方向？也许有更好的方法可以随时随地更改按钮的文本属性？

更新:我发现在 ted.com 上，他们使用 addthis api 做了一些类似的事情。但我想在没有 api 的情况下做到这一点。因此，如果您需要可视化我想做什么，请检查例如 http://www.ted.com/talks/dan_phillips_creative_houses_from_reclaimed_stuff.html .他们有一个以某种方式链接到推文按钮的输入字段。

Answer 1

您可以使用具有所有必需属性的自定义按钮代替 API 按钮，并放置 onclick 事件 url:

window.open('https://twitter.com/share?url=<url>&text=<text>', 'sharer', 'toolbar=0,status=0,width=620,height=280');

这将表现得像 Twitter 消息的弹出窗口。