Question

我正在尝试在Leaflet标记的弹出窗口中显示嵌入的推文。我正在使用tweetframe将推文加载到iframe中：

  var marker1 = L.marker(
    [52.3687433,4.8912132],
    {
      icon: new L.Icon.Default()
    }).addTo(map);

  var popup1 = L.popup({
    maxWidth: '2650'
  });

  var html1 = $('<div id="html" style="width: 100.0%; height: 100.0%;"><iframe class="tweet" id=tweet_493851197649207296 border=0 frameborder=0 height=250 width=550 src=https://twitframe.com/show?url=https://twitter.com/gideontailleur/status/493851197649207296></iframe></div>')[0];

  popup1.setContent(html1);
  marker1.bindPopup(popup1);

查看实时示例here

不幸的是，这看起来不太好，我想使用实际嵌入的推文。但是，根据Twitter上的示例添加此代码作为标记内容似乎不起作用。问题之一是我无法逃避html中引用错误的引号。当我解决这个问题时，可能会出现更多问题：

    var marker2 = L.marker(
    [52.36,4.89],
    {
      icon: new L.Icon.Default()
    }).addTo(map);

  var popup2 = L.popup({
    maxWidth: '2650'
  });

  var html2 = $("<blockquote class="twitter-tweet" data-lang="en"><p lang="en" dir="ltr">Hey <a href="https://twitter.com/hashtag/WindowsInsiders?src=hash">#WindowsInsiders</a>, we have released Build 15063.2 for Mobile to Fast ring - includes a single fix March 29, 2017</a></blockquote><script async src="//platform.twitter.com/widgets.js" charset="utf-8"></script>")[0];

  popup2.setContent(html2);
  marker2.bindPopup(popup2);

查看实时示例here。

Answer 1

JSFiddle上的代码突出显示了html2变量jQuery函数调用中的一个问题，最后是：

</script>

这将导致过早结束Javascript块。你只需要逃避这个：

<\/script>

在传单标记中嵌入推文

1 个答案: