Question

所以，我试图在点击该网页的链接时在div中显示一个网页。

点击链接后，我阻止浏览器转到链接，显示div，并在div中为<object>提供所点击链接的网址。

一切正常，div显示，对象获取被点击链接的url作为其数据属性的值。

我的问题是<object>没有显示任何内容。根据开发工具，它就在那里，但我没有看到网页。

这是我的javascript / jQuery代码：

$('a').click(function(event){
    event.preventDefault();
$('#tabViewWindow').show();
$('#tabViewWindow object').attr('data', $(this).attr('href'));
$('#tabVieWindow embed').attr('src', $(this).attr('href'));
});

以下是我在本地运行时出现问题的文件的完整代码：

<!Doctype HTML>
<html lang="en">
<head>
    <meta charset="utf-8" />
    <title>Tab View</title>
    <style type="text/css">
    html, body{
        height:100%;
        width:100%;
        margin:0;
        padding:0;
    }
    #tabViewWindow{
        height:100%;
        height:100vh;
        width:100%;
        width:100vw;
        position:absolute;
        background:#000000;
        display:none;
        left:0;
        top:0;
        z-index:10000000000000000;
    }
    embed, object, iframe, img{
        max-width:100%;
        margin:0 auto;
        display:block;
    }
    object{
        height:100%;
        width:100%;
    }
    </style>
    </head>
    <body>
        <div id="tabViewWindow">
            <object data="">
                <embed src="" />
            </object>
        </div>
        <br />
        <br />
        <a href="http://wolfram.com">Wolfram.com</a>
        <br />
        <br />
        <a href="http://wikipedia.org">Wikipedia.org</a>
        <br />
        <br />
        <a href="http://google.com">Google.com</a>
        <br />
        <br />

        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
        <script type="text/javascript">
        $('a').click(function(event){
            event.preventDefault();
            $('#tabViewWindow').show();
            $('#tabViewWindow object').attr('data', $(this).attr('href'));
            $('#tabVieWindow embed').attr('src', $(this).attr('href'));
        });
        </script>
    </body>
</html>

Answer 1

使用iFrame，它可以正常工作（至少在FF和Chrome上是最新的） - 请参阅：http://jsfiddle.net/WSW9J/1/

<div id="tabViewWindow">
    <iframe></iframe>
</div>

您是否有理由想要使用对象标签？

顺便说一句，如果您只想在自己的网页中显示其他网站的摘要，则可能会对http://pagepeeker.com/

感兴趣

使用javascript / jQuery </object>设置<object>的数据属性

1 个答案: