如何让ChildBrowser打开所有PDF文件

Question

我在PhoneGap (Cordov1.6)和ChildBrowser上使用Xcode4。我已经在OSX上使用SiteCrawler成功地下载了一个网站并将其本地化，它完全可以通过图片、PDF等在本地浏览。我已经将所有本地化的网站文件移到了PhoneGap www文件夹中，应用程序测试构建良好-该网站完全可以浏览。

我希望网站上的PDF可以在它们自己的窗口中打开，而ChildBrowser可以完美地满足我的需要。使用http://blog.digitalbackcountry.com/2012/03/installing-the-childbrowser-plugin-for-ios-with-phonegapcordova-1-5/，我能够安装ChildBrowser并正常工作--我可以在ChildBrowser中打开文件。

我的问题是，使用上面的链接，我必须在站点上的每个ontouchstart="loadChildBrowser('/path/to/file.pdf')；链接中添加PDF return false;“。由于我们使用的是CMS，所以这不是什么大问题--大部分PDF都是从模板中调用的，其中的数据都是从CMS中填充的，它们都很好。但是在站点中的一些页面中，客户端已经将指向上传的PDF的链接添加到页面的内容中。在这种情况下，没有简单的方法可以将上述代码添加到内联链接中。

我想我可以在单击时使用jQuery查看页面上的每个a标记，如果单击，则运行ChildBroswer实例，这将涵盖两种类型的PDF链接，但我似乎无法使其工作。这就是我所拥有的：

    <script type="text/javascript" src="/a/js/cordova-1.6.0.js"></script>
    <script type="text/javascript" src="/a/js/ChildBrowser.js"></script>
    <script>

    // install ChildBrowser
    var cb = ChildBrowser.install();

    //loading a web page in ChildBrowser 
    $('a[href$=pdf]').click(function() {
        var href = $(this).attr('href');
        cb.showWebPage(encodeURI(href));
        return false;
    });
    </script>

使用上面没有内联链接的javascript，PDF可以自己打开，没有子浏览器。

子浏览器将打开，对于某些链接，显示ontouchstart="loadChildBrowser('/path/to/file.pdf')；，而对于其他链接，只显示正在加载。我认为这只是对路径的调整，但我认为如果能让它工作，上面的方法将是最通用的。

    <script type="text/javascript" src="/a/js/cordova-1.6.0.js"></script>
    <script type="text/javascript" src="/a/js/ChildBrowser.js"></script>
    <script>

    // install ChildBrowser
    var cb = ChildBrowser.install();

    //loading a web page in ChildBrowser 
    function loadChildBrowser(file) { 
        cb.showWebPage(encodeURI(file)); 
    }
    </script>

Answer 1

通过反复试验，我在很大程度上做到了这一点。我仍然遇到了几个不相关的错误(好吧，与Childbrowser相关，但与go本地PDF文件的加载无关)。

因此，在站点上所有指向PDF的链接上使用ontouchstart="loadChildBrowser('/path/to/file.pdf')；return false；仍然是可行的。更改的是我用来确定PDF路径并启动ChildBrowser的JS函数。我不得不这么做：

<script type="text/javascript" src="/a/js/cordova-1.6.0.js"></script>
<script type="text/javascript" src="/a/js/ChildBrowser.js"></script>
<script>

    // install ChildBrowser
    var cb = ChildBrowser.install();

    //loading a web page in ChildBrowser 
    function loadChildBrowser(file) {
        var path = location.pathname+file;
        var len = path.length;
        var locleft = path.indexOf('/www/')+4;
        var trim = len-locleft;
        var left = path.slice(0,-trim);
        var locright = path.indexOf('/assets/');
        var trim = len-locright;
        var right = path.slice(-trim);
        var finalPath = left+right;
        cb.showWebPage(encodeURI(finalPath)); 
    } 

</script>

在我包含的头文件中(所以它存在于站点上每个页面的头中)。问题是，当ChildBrowser拉出文件的路径时，它会将普通网站的web根目录(/assets/documents/xxx.pdf)下的部分附加到当时在应用程序中查看的页面的完整路径中，所以我最终得到了：

/var/users/name/blah/blah/www/page.html/assets/documents/xxx.pdf

当我们需要的时候：

/var/users/name/blah/blah/www/assets/documents/xxx.pdf

上面的脚本将location.pathname添加到从调用ChildBrowser的函数(ontouch start)传递过来的文件var中，这样我们就得到了

/var/users/name/blah/blah/www/page.html/assets/documents/xxx.pdf (不正确)

然后，它将其拆分为左侧部分(/www之前的所有内容)和右侧部分(包括/assets/及其之后的所有内容)，然后将它们连接起来(有效地删除所有站点目录和html文件信息)，然后使用该finalPath调用ChildBrowser。为我工作。