0

我在这个网站上发现了一些关于如何在 Fancybox iframe 中打开 PDF 的非常有趣的代码，但我想在通过 PHP 生成的 CSS 菜单中使用，并通过 Google 控制台获取此消息：未捕获的 ReferenceError：href 未定义

这是我的php代码：

echo "<li class ='pdf' ><a href='http://assets/newsletters/temp/".$myissue."' > Issue# ".$filename."</a></li> ";

在 Fancybox 我有以下代码：

<script type="application/javascript">
    $(document).ready(function() {
 $(".pdf").click(function() {
  $.fancybox({
    type : 'iframe',
    width: 800,
    height: 1000,
    fitToView : true,
    autoSize : false,
    href: this.href,
    content : '<embed src="' + href + '#nameddest=self&page=1&view=FitH,0&zoom=75,0,0" type="application/pdf" height="99%" width="100%" />',
   'onClosed': function() {
     $("#fancybox-inner").empty();
   }
  });
  return false;
 }); // pdf 
}); // ready

</script>

我需要帮助，以便每次单击时都可以加载不同的 PDF。

更新 所以我用我想查看的文件更改了内容，它可以工作。所以我的问题仍然是我不知道如何将它传递给fancybox的动态Href

content : '<embed src="http://assets/newsletters/temp/Newsletter_1.pdf" type="application/pdf" height="99%" width="100%" />',
4

2 回答 2

0

所以我在 JFK 的这个链接上找到了我最后一个问题的答案： https ://github.com/fancyapps/fancyBox/issues/579 它解决了 Chrome/IE Header 问题。

我最终的fancybox代码如下所示：

$(document).ready(function () {
    $(".pdf").fancybox({
        type: 'iframe',
        width: 800, 
        height: 1000, 
        fitToView: false, 
        autoSize: false,
        iframe : {
        preload: false
    }
    });
}); // ready

我还对我的 php 代码进行了一些调整：

echo "<li><a class ='pdf' href='http://assets/newsletters/temp/".$myissue."' > Issue# ".$filename."</a></li> ";

谢谢@JFK

于 2013-05-08T13:20:33.060 回答
0

好吧，您要么使用hrefAPI 选项，要么使用content选项。

在上面的代码中，您已经设置了，href但后来该content选项覆盖了它....我猜您认为通过这样做href: this.href，您实际上是在将值设置href为变量，然后将其传递给content语句，但这不是它的工作方式，对不起。

此外，您正在混合不兼容的 v1.3.x 和 v2.x 选项。

我认为您不应该使事情过于复杂，而只需执行以下操作：

$(document).ready(function () {
    $(".pdf").fancybox({
        type: 'iframe',
        width: 800, 
        height: 1000, 
        fitToView: false, // false will display the exact size you set above
        autoSize: false
        // you don't need the following :
        // href: this.href,
        // content : '<embed src="' + href + '#nameddest=self&page=1&view=FitH,0&zoom=75,0,0" type="application/pdf" height="99%" width="100%" />',
        // onClosed is for v1.3.x and doesn't work with v2.x
        //'onClosed': function() {
        //$("#fancybox-inner").empty();
        //}
    });
}); // ready

见JSFIDDLE

于 2013-05-07T20:03:44.077 回答