javascript - 动态替换/重新渲染 Twitter 搜索源

Question

我有一个标准的 twitter 搜索提要和一个输入框，用户应该在其中输入一个术语，然后切换提要以搜索 twitter 来搜索他们输入的任何内容。我听说您可以通过添加数据属性来按用户名更改嵌入的提要，但到目前为止，我还没有看到任何人报告如何使用搜索提要执行此操作...

<a class="twitter-timeline" data-dnt="true" href="https://twitter.com/search?q=Christmas" data-search="Christmas" data-widget-id="12345">Tweets about Christmas</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 非常简单 -

$('.twitter-timeline').attr('href', 'https://twitter.com/search?q=' + encodeURIComponent($('#search').val())).attr('data-search', encodeURIComponent($('#search').val()));
twttr.widgets.load(); 

所以你可以看到这个想法是它只是替换了 a 标签和 data 属性的 href，然后尝试调用 twttr.widgets 上的 load() 函数> 对象。这没有任何作用。

有人知道是否可以在嵌入式 Twitter 搜索源上动态切换关键字吗？

Answer 1

不，这是不可能的。

您可以使用工厂函数在运行时创建小部件 ( https://dev.twitter.com/web/javascript/creating-widgets#create-timeline )。使用 twttr.widgets.createTimeline 您可以定义数据源，但这只能是以下之一:个人资料、点赞、列表、集合、URL(并且 URL 只能是 Twitter 个人资料、点赞、列表，或集合，小部件配置)，小部件。

例如，按用户名进行“搜索”是有效的:

 twttr.widgets.createTimeline(
    sourceType: 'url',
    url: 'https://twitter.com/' + encodeURIComponent( $('#search').val())
    },
    ...

https://jsfiddle.net/user2314737/jba2uqam/

虽然这不起作用:

twttr.widgets.createTimeline(
    {
    sourceType: 'url',
    url: 'https://twitter.com/search?q=' + encodeURIComponent( $('#search').val())
    },
    ...

要进行自定义搜索，您需要使用需要身份验证的 API ( https://dev.twitter.com/rest/reference/get/search/tweets )。