我很难找到一种方法将
embed a tweet动态地发送到网页中.理想情况下,我希望用户输入Twitter状态URL(如
https://twitter.com/robdelaney/status/329651129988288514),单击按钮,并将推文嵌入div中.
这是我到目前为止所得到的:
$(document).ready(function(){
$("#resolve").click(function(){
var url = $("#retweet_form_url").val();
if (url==""){
$(".controls").addClass("error");
}
else {
$("#tweet_div").show();
$.ajax({
url: "https://api.twitter.com/1/statuses/oembed.json?url="+url,dataType: "jsonp",success: function(data){
// Derp! What do I do here?
}
});
}
})
})
当我使用URL测试时,我确实从Twitter获得了一个JSON响应,而不是包含嵌入推文所需的整个HTML,但是当我尝试解析它时,我无法在我的div中出现任何内容.谁能指出我正确的方向?
解决方法
data是包含推文详细信息的对象,包括包含实际嵌入代码的html成员.所以:
// ...
success: function(data){
$("#tweet_div").html(data.html);
}
// ...
$(document).ready(function() {
$("#resolve").click(function() {
var url = $("#retweet_form_url").val();
if (url == "") {
$(".controls").addClass("error");
} else {
$("#tweet_div").show();
$.ajax({
url: "https://api.twitter.com/1/statuses/oembed.json?url=" + url,success: function(data) {
$('#tweet_details').html(data.html);
}
});
}
})
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <input id=retweet_form_url value="https://twitter.com/robdelaney/status/329651129988288514" /> <button id=resolve>resolve</button> <div id=tweet_details></div>