html5 – 在页面加载时没有加载iFrame(jQuery Mobile)

我无法在第一次加载jQuery移动支持页面时显示iFrame.

我有一个iFrame如下：

< iframe id =“manual”src =“pdf / manual.pdf”style =“width：100％; height：100％;”>< / iframe>

由于某种原因,当页面加载时,iFrame无法加载它.如果我刷新页面,我只能看到PDF文件.这是为什么？

为什么没有页面刷新,PDF文件首先没有出现在iFrame中？

感谢大家的任何见解.

编辑：

当我尝试使用safari打开页面时,我收到以下警告：

资源解释为Document但使用MIME类型application / pdf进行传输.

这可能与PDF无法正确加载的原因有关吗？

解决方法

我只是尝试使用rel =“external”它没有刷新..第一个链接是ajax调用而第二个链接不是.它很直接,不确定我是否遗漏了你的其他东西..

Page1.html

<!DOCTYPE html> 
<html> 
    <head> 
    <title>Demo Page</title> 
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.css" />
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.6.4.min.js"></script>
    <script type="text/javascript" src="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.js"></script>
</head> 
<body> 
<div data-role="page">
    <div data-role="header">
        <h1>Demo Page</h1>
    </div>
    <div data-role="content">           
        <a href="page2.html" data-role="button">Another Page</a>
        <a href="page2.html" rel="external" data-role="button">View User Manual</a>         
    </div>
</div>
</body>
</html>

Page2.html

<!DOCTYPE html> 
<html> 
    <head> 
    <title>Another Page</title>     
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.css" />
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.6.4.min.js"></script>
    <script type="text/javascript" src="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.js"></script>
</head> 
<body>

<div data-role="page" data-add-back-btn="true">
    <iframe id="manual" src="FocusFree.pdf" style="width: 100%; height: 100%;"></iframe> 
    <div data-role="header" data-theme="none">
        <h1>Another Page</h1>
    </div>
    <div data-role="content" data-theme="none"> 
        <p>This is another page,dude.</p>
    </div>
</div>

</body>
</html>

html5 – 在页面加载时没有加载iFrame(jQuery Mobile)

解决方法

相关文章