Question

我有一个页面，显示PDF文档。该文档有多个版本。我有一个不同版本的下拉列表。用户可以选择所需的版本，选择后，页面上的PDF文档将发生更改，网页上的标题也会发生变化，以反映文档的版本。这是通过一些简单的JavaScript完成的。

目前在Chrome和Firefox中可以正常使用。但是，在Internet Explorer（版本11）中，显示的PDF不会更改。只有H1标题会更改。

我已经检查了控制台日志，并且没有错误。我尝试了其他方法，例如：

document.getElementById("pdfView").setAttribute("data", "filepath.pdf");

，但是问题是相同的（而且我读到，无论如何这在IE中都不起作用）。我一直在寻找一种可能有效的替代方法，因为我正在使用的方法可能与IE不兼容。

/* Title of document */ 

<h1 id="docTitle">Document title (version 1)</h1>

/* The dropdown list to select a document version */

<select id="documentList" onchange="selectDocument()">
   <option value="v1">Document v1</option>
   <option value="v2">Document v2</option>
</select>

/* The PDF viewer which displays the file. By default, latest version. */

<div id="pdfViewerStyle">
    <object data="filev2.pdf" id="pdfView" type="application/pdf" 
     width="100%" height="100%">
    </object>
</div>

/*The JavaScript to allow H1 title and pdf filepath to change and dynamically update page depending on user's selection.*/

function selectDocument() {

    var index = document.getElementById("documentList").selectedIndex;

    // if the document selected is version 1
    if(index == 0) {
      //change the title
      document.getElementById("docTitle").innerHTML="Document title (version 1)";

      //change the pdf viewer filepath to the version 1 document
      document.getElementById("pdfView").data="filev1.pdf";
    }

    // if the document selected is version 2
    else if (index == 1) {
      //change the title
      document.getElementById("docTitle").innerHTML="Document title (version 2)";

      //change the pdf viewer filepath to the version 2 document
      document.getElementById("pdfView").data="filev2.pdf";
    }

}

Answer 1

我测试了您的代码并重现了该问题。然后，我尝试使用<iframe>代替<object>，它可以在所有浏览器中正常工作。您可以更改部分代码，如下所示：

/* The PDF viewer which displays the file. By default, latest version. */

<div id="pdfViewerStyle">
    <iframe src="filev2.pdf" width="800" height="600" id="pdfView"></iframe>
</div>

在用户选择版本时更改src的{{1}}：

<iframe>

为什么.data =“ [filepath]”在Internet Explorer中不起作用？

1 个答案: