Question

我正在为一个客户开发一个项目，他们希望将自己动态的最新新闻源嵌入到我们网站的右侧。这是一个相当自定义的模块，包含视频和链接，而不仅仅是RSS或Twitter。

客户已将此内容作为专门供我们抓取的页面上传到他们的服务器，并为我们提供了网址。

我可以使用iFrame嵌入内容，但是他们的链接中没有target =“_ parent”，所以如果点击链接，新内容将加载到iframe中，这不是我们想要的。我们希望它在新标签中打开。不幸的是，我们无法改变他们的内容或者让他们连续两周 - 这将为时已晚！为了让它更加烦人，我们不在同一个领域。

我们的系统是基于asp.net构建的，我不知道（我更喜欢PHP！）。值得一提的是，我是这个角色的前端开发人员，无法访问或修改任何asp.net代码。

我尝试过使用jQuery .load（）但没有成功。作为一个新手我不确定正确的方法，或者甚至可能使用前端技术？

似乎我的类似问题都陈旧且过时了，所以最好采用最新最好的方法。

感谢。

Answer 1

如果您使用.load()提取内容，它会在完成时具有回调函数。只需遍历该部分中的所有<a>个链接，然后将其target=更改为在新标签中打开！

css: target-new: tab ! important（不幸的是，这只是css3兼容）

Answer 2

如果您可以确保正在加载的页面中的<head>包含：

<base target="_blank" />

然后所有链接都将在新窗口中打开。如果您无法确保页面中包含<head>中的页面，则可以选择通过服务器端HTTP请求下载页面数据，并在将页面嵌入到框中之前手动添加该标记。如果您不想进行任何服务器端工作，那么您也可以在客户端执行此操作。以下是如何完成的简化版本：

$.get("http://exampleurl.com/", function (data) {
    var pos = data.indexOf("<head>");
    if(pos == -1) {
        //pretty impossible
        return;
    }
    data = data.substr(0, pos + 5) + '<base target="_blank" />' + data.substr(pos + 6, data.length - (pos + 6));
    //display data
});

Answer 3

使用 jQuery .load（），您需要提取页面上的所有JS代码并使其成为此部分的目标，因为它只会加载DOM元素。这有点棘手，但在改变了一些事情和路径后，你可以让它发挥作用。

另一种，也许更简单的方法，但如果你在同一个域上，它只能：

$("#iFrame").contents().find("a").on("click",function(e)
{
    e.preventDefault();
    // then use the href to virtualy create a link click event :-)
});

在没有iframe的情况下导入外部URL内容

3 个答案: