0

そのため、trigger.io を使用して、下部にカスタム メニューがあり、各ボタンが外部 HTML ページをメイン コンテナーにロードするページを作成していました。これを機能させるにはハックする必要があったので、もっと良い方法があるかどうか疑問に思っていました。

を使い始めましたが、うまくいき$('.main').load('pages/test.html')ません。代わりに、私はしなければなりませんでした：

forge.file.getLocal('pages/test.html', function (file) {
  forge.file.string(file, function (str) {
    $('.main').html(str);
  });
});

ちょっと面倒です。

また、strHTML コンテンツをタグとして使用すると、属性がめちゃくちゃになるimgため、img が表示されません。srcだから私は別のハックをしなければなりませんでした：

forge.file.getLocal('pages/test.html', function (file) {
  forge.file.string(file, function (str) {
    var $main = $('.main');
    $main.html(str);

    //Hack to resolve img src
    var imgPath;
    $main.find('img').each(function () {
      var $this = $(this);
      // First 8 chars is "file:///"
      imgPath = $this.prop('src').substr(8);
      forge.file.getLocal(imgPath, function (file) {
        $this.prop('src', file.uri);
      });
    });
  });
});

手間をかけずに外部 HTML ページを純粋にロードするより良い方法はありますか?

ありがとう！

4

1 に答える 1

1

Android 4.1 と iOS (iPhone シミュレーターと iPad の両方) で forge プラットフォーム v1.4 (執筆時点では v1.4.18) をテストした結果、jQuery の load メソッドを特別な努力なしで使用できるようです。私のテストケースの構造は次のとおりです。

src/
  index.html
  face.png
  pages/
    hello.html

の内容はこちらindex.html

<!DOCTYPE html>
<html>
<head>
<script src="js/jquery-1.7.1.min.js"></script>
<script type="text/javascript">
    $(function () {
        $('.content').load('pages/hello.html');
    });
</script>
</head>
<body>

<div class="content">
</div>

</body>
</html>

そしてpages/hello.html：

<b>hello world</b><img src="face.png">

アプリの起動直後にこれが発生しました： $.fn.load を使用した結果

このアプローチでわかる 1 つの落とし穴はsrc、タグの属性imgが に対して相対的でなければならないということindex.htmlです。それでも問題が解決しない場合は、より具体的なテストケースおよび/または使用したフォージ プラットフォームのバージョンの詳細、およびテストしたデバイス/シミュレーターが役立つ場合があります。

于 2012-10-25T09:42:23.770 に答える