1

我正在尝试遍历从 a 返回的一组结果db.transaction。在这个循环中，我将 html 内容附加到一个 JavaScript 变量中，一旦循环完成，它就会使用 jQuery 的html()函数添加到 DOM 中。这按预期工作。

问题是在循环期间，我正在进行另一个db.transaction查询。我遇到的问题是第二个查询（循环内）在移动到循环的下一次迭代之前没有完成。

我最初使用for()循环，但认为这是导致问题的原因，因为 for 循环无法知道db.transaction循环内的循环是否已完成。

所以我决定使用递归循环，如下所示：

var html_content = '<table class="booking-table"><tbody>';
var i = 0;

function getPhotoCountForSyncItemSuccessRecursive(i){
    html_content += "More HTML content, not relevant"
    localStorage.setItem("current_row_booking_id", results.rows.item(i).id);
    i++;
    db.transaction(getPhotoCountForSyncItem, getPhotoCountForSyncItemFailRecursive,                 getPhotoCountForSyncItemSuccessRecursive(i));

    if (i == results.rows.length){
        html_content += '</tbody></table>';
        $('.booking-items-wrapper').html(html_content);
    }
}

getPhotoCountForSyncItemSuccessRecursive(i);

因此，首先我设置了 2 个变量，一个用于保存 html 内容（html_content），另一个用于保存当前结果的计数（i）

接下来是getPhotoCountForSyncItemSuccessRecursive()接受一个参数的函数声明，即当前计数 ( i )。在这个函数之后，我正在调用该函数来启动递归循环。

在函数中，我正在对 html_content 变量进行大量附加（此处未显示，因为它无关紧要）。然后我设置一个localStorage名为current_row_booking_id的值，该值具有当前结果 id 的值（不久将在第二个查询中使用）。

然后我增加计数，并调用函数的递归部分：

db.transaction(getPhotoCountForSyncItem, getPhotoCountForSyncItemFailRecursive, getPhotoCountForSyncItemSuccessRecursive(i));

如您所见，我调用了一个函数getPhotoCountForSyncItem，并在成功时调用递归函数getPhotoCountForSyncItemSuccessRecursive(i)（创建我的循环）

我的getPhotoCountForSyncItem（以及它的成功和失败回调）看起来像：

function getPhotoCountForSyncItem(tx){
    tx.executeSql("SELECT * FROM booking_photo WHERE booking_id = '" + localStorage.getItem("current_row_booking_id") + "'", [], getPhotoCountForSyncItemSuccess, getPhotoCountForSyncItemFail);
}

function getPhotoCountForSyncItemFail(tx, results){
  console.log("getPhotoCountForSyncItemFail");
  localStorage.removeItem("current_row_booking_id");
}

function getPhotoCountForSyncItemSuccess(tx, results){
    if (results.rows.length == 0){
        console.log('no photos');
        localStorage.removeItem("current_row_booking_id");
    } else {
        console.log('got photos ' + results.rows.length);
        localStorage.removeItem("current_row_booking_id");
    }
}

我遇到的问题是递归函数（ ），只有在函数完成后getPhotoCountForSyncItemSuccessRecursive才能再次调用它，然后再触发。getPhotoCountForSyncItem关于什么是错的任何建议？有没有更好的方法来做到这一点？

4

0 回答 0