2013-06-11 2 views
1

그래서 해당 웹 페이지 링크를 클릭하면 div 안에 웹 페이지를 표시하려고합니다.<object>의 데이터 속성이 javascript/jQuery로 설정되어 있습니다.

링크를 클릭하면 브라우저가 링크로 이동하여 div가 표시되고 클릭 한 링크의 URL이 <object> div 안에 들어갑니다.

이 모든 것이 잘 작동하고 div가 표시되며 개체는 데이터 속성의 값으로 클릭 된 링크의 URL을 가져옵니다.

내 문제는 <object>에 아무것도 표시되지 않는다는 것입니다. dev 도구에 따르면, 거기에 있지만, 웹 페이지가 표시되지 않습니다. 그것을

<!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> 
+0

개봉 된 $ (이) –

+1

는 왜 iframe을을 사용하여 오용에 관심이있을 수 있습니다? –

+0

@ScottSelby - 그 문맥에서'$ (this)'는''이라고 설명합니다. http://jsfiddle.net/cCs3n/ – Gabe

답변

1

iframe을 함께 : 여기

내 자바 스크립트/jQuery 코드입니다 :

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

여기에 내가 로컬로 실행할 때 문제가 존재하는 파일의 전체 코드입니다 작품 (적어도 FF와 크롬에서에서 최근은) - 참조 : http://jsfiddle.net/WSW9J/1/

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

이 t인가 여기 왜 대신 객체 태그를 사용하려는 이유가 있습니까? 당신이 당신의 페이지에 다른 웹 사이트의 미리보기를 표시하려면 그런데

는, 당신은 http://pagepeeker.com/

+0

HTML5에서 '