Question

我已经实现了从设备上的外部文件加载json数据的代码。该程序应该像这样工作：首先点击事件，它将尝试查看本地存储文件（course.txt），如果它存在，则读取并显示它（标题列表）。

HTML code：

<div data-role="page" id="page1">
    <a href="#page2" onclick="courseList()">Load Course</a></div>
</div>
<div data-role="page" id="page2">
    <p id="text" align="center"></p>
    <div id="print"></div>
</div>

JS代码：

jsonString = '';
function courseList() {
    readWriteFile();
    var myData = JSON.parse(jsonString);
    if (myData != '' || myData != undefined) {
        var $list = $('#print');
        $.each(myData, function(i, item) {
            $list.html(item.title);
        });
    } else {
        document.getElementById('text').innerHTML = 'No data in storage';
    }
}

function readWriteFile() {
    window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, onFSSuccess, onFSError);
}
function onFSSuccess(fileSystem) {
    fileSystem.root.getFile("course.txt", {create:true, exclusive:false}, gotFileEntry, onFSError);
}
//FileReader Cordova API
function gotFileEntry(fileEntry) {
    fileEntry.file(gotFile, onFSError);
}
function gotFile(file) {
    readAsText(file);
}
function readAsText(file) {
    var reader = new FileReader();
    reader.onloadend = function(evt) {
        console.log("Read as text");
        console.log(evt.target.result);
    };
    reader.readAsText(file);
    jsonString = reader.readAsText(file);
}
function onFSError(err) {
    console.log(err.code);
}

考虑到上述程序，结果是空的。我无法察觉我的错误。任何帮助将不胜感激。

Answer 1

试试这个

function readAsText(file) {
  var reader = new FileReader();
  //asnycrhonous task has finished, fire the event:
  reader.onloadend = function(evt) {
    console.log("Read as text");
    console.log(evt.target.result);
    //assign the data to the global var
    jsonString = evt.target.result
    //keep working with jsonString here
  };
  reader.readAsText(file);    
}

Answer 2

这种情况正在发生，因为文件读取是异步发生的。在 onloadend 中添加 readAsText 。

尝试添加：

function readAsText(file) {
    var reader = new FileReader();
    reader.onloadend = function(evt) {
        console.log("Read as text");
        console.log(evt.target.result);
        reader.readAsText(file);
        jsonString = reader.readAsText(file);
    };   
}

PhoneGap：File API - 在点击事件上加载json数据

2 个答案: