2

我将 Xcode 4 与 PhoneGap (Cordova 1.6) 和 ChildBrowser 一起使用。我在 OSX 上使用 SiteCrawler 成功下载了一个网站并将其本地化，它可以在本地使用图像、PDF 等完全浏览。我已将所有本地化的站点文件移动到 PhoneGap www 文件夹中，并且应用程序测试构建良好 -网站完全可以浏览。

我希望网站上的 PDF 在他们自己的窗口中打开，而 ChildBrowser 可以根据我的需要完美地做到这一点。使用http://blog.digitalbackcountry.com/2012/03/installing-the-childbrowser-plugin-for-ios-with-phonegapcordova-1-5/我能够安装并运行 ChildBrowser - 我打开了 PDF 文件在子浏览器中。

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

我想我可以使用 jQuery 在单击时查看页面上的每个标签，如果单击，则运行 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'); return false;" 一起使用，子浏览器将打开，并且对于某些链接显示 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>
4

1 回答 1

3

Through trial and error I was able to get this working for the most part. I'm still hitting a couple of unrelated bugs (well, related to Childbrowser but not the loading go local PDF files).

So, using ontouchstart="loadChildBrowser('/path/to/file.pdf'); return false;" on all links to PDFs on the site is still the way to go. What changed was the JS function I am using to determine the path to the PDFs and launch ChildBrowser. I had to do this:

<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>

in my included header file (so it lives in the head of every page on the site). The problem was that when ChildBrowser pulled up the path to the file, it was appending the part below the normal site's web root (/assets/documents/xxx.pdf) to the full path to the page being viewed in the app at the time, so I ended up with:

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

when we wanted:

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

The script above prepends location.pathname to the file var passed from the function (ontouch start) that calls ChildBrowser so that we end up with

/var/users/name/blah/blah/www/page.html/assets/documents/xxx.pdf (not correct)

It then splits it into a left section (everything before /www) and a right section (everything including and after /assets/) and then concatenates them (effectively removing all the site directory and html file information) and then calls ChildBrowser with that finalPath. Working for me.

于 2012-04-27T06:12:31.557 回答