Question

我有一个简单的 index.html 文件，可以使用jquery库中的 .load 函数显示 test.txt 文件中的字符串将字符串内容放到html （div class =“konten”）。

以下HTML脚本：

<script type="text/javascript" charset="utf-8" src="js/lib/cordova-1.9.0.js"></script>
<script type="text/javascript" charset="utf-8" src="js/lib/jquery-2.0.2.js"></script>
...
<body onload="init();">
    <div class="center">
        <div class="konten"></div>
    </div>
</body>
...

和js：

$(document).ready(function(){
    $('.konten').load('test.txt',function(responseTxt,statusTxt,xhr){
      if(statusTxt=="success")
        alert("External content loaded successfully!");
      if(statusTxt=="error")
        alert("Error: "+xhr.status+": "+xhr.statusText);
    });
});

当我尝试在桌面浏览器上运行 index.html 文件（快速测试）时，没有显示 test.txt 的内容，并显示javascript alert 错误：404：错误。

我写的脚本有什么问题吗？

HTML编辑器：Eclipse 4.2.2（Juno）

cordova-1.9.0

的jquery-2.0.2

Answer 1

在deviceready事件中尝试代码，而不是文档就绪事件。

document.addEventListener("deviceready", onDeviceReady, false);

function onDeviceReady() {
   $('.konten').load('test.txt',function(responseTxt,statusTxt,xhr){
     if(statusTxt=="success")
        alert("External content loaded successfully!");
     if(statusTxt=="error")
        alert("Error: "+xhr.status+": "+xhr.statusText);
    });
}

Answer 2

您可以使用以下登录信息。通过这种方式，您可以根据您使用的是桌面浏览器还是在移动应用程序中调用所需的功能。

function onBodyLoad() {
    // these are useful later in the app, might as well set early
    window.isRipple = (window.tinyHippos != null);
    window.isPhoneGap = /^file:\/{3}[^\/]/i.test(window.location.href);
    window.isIOS = !window.isRipple && navigator.userAgent.match(/(ios|iphone|ipod|ipad)/gi) != null;
    window.isAndroid = !window.isRipple && navigator.userAgent.match(/(android)/gi) != null;

    // stuff I use for debugging in chrome
    if (window.isPhoneGap) {
       document.addEventListener("deviceready", onDeviceReady, false);
    } else {
       onDeviceReady();
    }
}

您可以在页面的body load事件上调用此函数。

<body onload="onBodyLoad()">

我记得在SO中看到其他人发布的这个逻辑。真正的功劳应归功于该用户。

Eclipse Phonegap无法使用jquery .load函数加载外部字符串文件

2 个答案: