1

使用 Internet Explorer 并显示绑定到 PDF 的 iframe,如果我使用 display:none,PDF 将无法正确关闭。

这是一个功能齐全的示例,取决于 Adob​​e Reader 加载 PDF 所需的时间,PDF 可能无法正确关闭/隐藏。

如果单击“displaypdf”,则 PDF 将显示在 iFrame 中,如果单击关闭(显示:无),则 PDF 不会隐藏。如果可以的话,我想避免使用“对象”标签。

PDF不隐藏

确保 PDF 关闭的方法是什么?

<html>
 <head>   
   <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
   <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" ></script>
   <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>   
   <script type="text/javascript">
    $(document).ready(function() {
        // Note: this is not idiomatic javascript or jquery
        // just wanted to provide an example.
        $('#closePdf').click(function(){
            //$('#dialog').hide();
            $('#dialog').css({
                  'display': 'none' 
            });
        });s        
        $('#displayPdf').click(function(){          
            $("#dialog").empty();
            $("#dialog").append("<iframe src='http://partners.adobe.com/public/developer/en/xml/AdobeXMLFormsSamples.pdf'></iframe>");
            $('#dialog').css( {
                'position': 'absolute',
                'right': 100,
                'top': 100,
                'display': 'block'
            });
        });     
     });
   </script>
 </head> 
 <body>    
    <div style="background-color:#F1F1F1; width:900px; height:800px">
        Data  
        <br />
        <a id="displayPdf" href="#">Display PDF</a>  
        <br />      
        <a id="closePdf" href="#">Close PDF</a>
    </div>          
    <div id="forIFrame"></div>    
    <div id="dialog" title="Basic dialog" >      
    </div>
 </body>
</html>

环境:

Internet Explorer 10 Adob​​e Reader 10 Windows 7

4

1 回答 1

1

第 15 行的示例代码中有一个错误的 's'。在我删除它之后,您的代码似乎可以工作。我清理了你的例子多一点:http: //jsfiddle.net/7fPed/

<html>
<head>
  <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
  <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
</head>

<body>
  <div style="background-color: #F1F1F1; width: 900px; height: 820px">
    Data            
    <br />
    <a id="displayPdf" href="#">Display PDF</a>
    <br />
    <a id="closePdf" href="#">Close PDF</a>
  </div>

  <div class="frameDiv" style="display: none; position: absolute; left: 200px; top: 20px">
    <iframe style="width: 618px; height: 800px" id="myFrame" src=""></iframe>
  </div>
</body>

<script type="text/javascript">
  $(document).ready(function () {
    var href = "http://partners.adobe.com/public/developer/en/xml/AdobeXMLFormsSamples.pdf"

    $('#closePdf').click(function (e) {
      e.preventDefault();
      $('.frameDiv').hide();
    });

    $('#displayPdf').click(function (e) {
      e.preventDefault();
      $('#myFrame').attr("src", href + "#view=VFit" + "&toolbar=0" + "&navpanes=0");
      $('.frameDiv').show();
    });
  });
</script>
</html>
于 2013-07-21T20:45:36.553 回答