Question

我创建了iframe，并且开头没有src。当我点击某个链接（例如Google搜索结果）时，该链接应尝试在该iframe中打开。不在我目前正在浏览的标签中。

$(document).ready(function () { 

    $('<div />', {
        id: 'firster',
        style: 'position: fixed; top: 0; bottom: 0; right: 0; max-width: 500px; z-index: 120;'
    }).appendTo('body');

    $('<iframe />', {
            name: 'frame1',
            id: 'frame1',
            src: ''
        })
        .css({
            'height': '100%',
            'width': '450px'
    }).appendTo('#firster');

    $("a").click(function(e) {
        $("#frame1").attr("src", window.location.protocol + '//' + window.location.host +  $(this).attr("href"));
        return false;
    })

});

我期望打开该网址（我将协议主机和网址合并），它只是不打开。

点击链接前的元素状态：

点击链接后的元素状态：

如何解决这个问题？有什么方法吗？

编辑部分

这就是我在控制台中定期获取的内容：

阻止跨源请求：同源策略禁止读取远程资源在 https://accounts.google.com/ServiceLogin?passive=1209600&osid=1&continue=https://notifications.google.com/u/0//idv2&followup=https://notifications.google.com/u/0//idv2&authuser=0。（原因：缺少CORS标题'Access-Control-Allow-Origin'。

Answer 1

有点想出我想要的东西。对于想要在这里看到它的每个人：

$(document).ready(function () { 

    $('<div />', {
        id: 'firster',
        style: 'position: fixed; top: 0; bottom: 0; right: 0; max-width: 500px; z-index: 120;'
    }).appendTo('body');

    $('<iframe />', {
            name: 'frame1',
            id: 'frame1',
            src: ''
        })
        .css({
            'height': '100%',
            'width': '450px'
    }).appendTo('#firster');

    function loadIframe(iframeName, url) {
        if ( window.frames[iframeName] ) {
            window.frames[iframeName].location = url;   
            return false;
        }
        return true;
    }
    $("a").click(function(e) {
        $("#frame1").attr("src", decodeURIComponent($.urlParam('url', $(this).attr("href")))); // no prepend of current URL, just use the href directly


        return false;
    })

    $.urlParam = function (name, urlItself) {
        var results = new RegExp('[\?&]' + name + '=([^&#]*)')
                          .exec(urlItself);

        return results[1] || 0;
    }

   // console.log($.urlParam('url', urlItself)); //registration

});

我确信这将适用于谷歌搜索结果链接，并不确定它是否可扩展但它适用于我的原始目的。另外，非常感谢所有为此问题做出贡献的人。

Answer 2

你可以在html中实现它

这里试试这个

<iframe height="300px" width="100%" src="" name="iframe_a"></iframe>

<p><a href="https://www.stackoverflow.com" target="iframe_a">stackoverflow.com</a></p>

你无法达到目标，因为。它将src写成＆＃34; yourwebsie.com + src＆＃34;

在jquery中

：

  $(document).ready(function(){
    $("a").click(function(){
    var k=$(this).attr("src"))
        $("iframe").attr("src",k);
    });
});

javascript方法：

<script>
 function loadIframe(iframeName, url) {
    if ( window.frames[iframeName] ) {
        window.frames[iframeName].location = url;   
        return false;
    }
    return true;
}</script>

<a href="link" onclick="return loadIframe('ifrm', this.href)">whasjjjf</a>
    <iframe name="ifrm" id="ifrm" src="tabs.html" frameborder="0">
    Your browser doesn't support iframes.</iframe>

打开从链接到iframe的URL

2 个答案: