Question

以下代码将参数变量nextId传递给IndexedDB Store get方法，如果传递的参数与记录的键匹配，则返回相应的记录。

最初我创建了另一个将所有记录都放入数组的方法，然后我返回了数组长度。但是我的循环只是得到应有的最后一个值。

代码如下所示：注意：此方法getEmployeeCount()保存数组长度并使用如下：

    var something;
    for ( var i = 1; i <= getEmployeeCount(); i ++ )  {
        something = i;
    }

实验工作代码：

function displaySingleRecord() {

    var output = document.getElementById( 'display' );
    output.textContent = "";

    var store = getObjectStore(DB_STORE_NAME, 'readwrite');

    var  nextId = incre ++;
    var request = store.get(nextId.toString());

    request.onerror = function(e) {
        dbStatusMessage('Cannot Retrieve data.', 1);
    };

    request.onsuccess = function(e) {

        output.innerHTML = '<b>Employee ID:</b> '  + request.result.employeeId  + ' <br> ' +
                           '<b>First Name:</b>  '  + request.result.firstName   + ' <br> ' +
                           '<b>Last Name:</b>   '  + request.result.lastName    + ' <br> ' +
                           '<b>Email:</b>       '  + request.result.email       + ' <br> ' +
                           '<b>Department:</b>  '  + request.result.department;
    };
}

当记录到达结束记录或最后一条记录时，如何将增量重置为1。我尝试使用输出，这是一个p标签，但没有用。

if ( output.textContent === '')
     doReset;

更新： 工作解决方案：

我遇到的主要问题之一是从光标获取总记录，而不是使用此数字作为重置增量过程的阈值。以下步骤说明了我为获得解决方案所做的工作：

第一步： 我使用hidden field来保留增量值并将其返回到执行增量的方法：我还添加了两个按钮：next和prev。

HTML：

<!--Hidden Field-->
<input id="currentValue" value="0" type="hidden" />

<a id="next" href="/">Next</a>
<a id="prev" href="/">Previous</a>

<!--Output value here-->
<p id="output"></p>

接下来，我需要从数据存储中获取总记录：我是通过在getTotalRecordCount方法中获取数组的长度来实现的。请记住，当我们增加时，我们需要知道结束是否到达，这样我们不会点击下一步并看到空结果，我们只需重置为一。注意：我们将记录数组传递给回调，以避免IndexedDB异步架构：

出现问题

从商店获取总记录的方法：

function getTotalRecordCount(callback) {

    var IDBOpenRequest = indexedDB.open(Database.Name, Database.Version);

    IDBOpenRequest.onerror = function () {
        dbStatusMessage('Database failed to open.', 1000);
    };

    IDBOpenRequest.onsuccess = function (e) {

        var objectStore = getObjectStore(Database.Store.USGeological, 
            Database.ReadWrite, e.target.result);

        var record = [];
        var cursorRequest = objectStore.openCursor();

        cursorRequest.onsuccess = function (e) {
            var cursor = e.target.result;
            if (cursor) {
                record.push(cursor.value);
                cursor.continue();
            } else {

                callback(record);
            }
        };

        e.target.result.close();
    };
}

下一步：我们从getNextId方法的回调中访问记录数组。

代码：

function getNextId(val) {

    getTotalRecordCount(function (record){

    // Get initial or current value from hidden field.    
    var currentValue = document.getElementById('currentValue');

    var newValue = parseInt(currentValue.value,10) + val;

    // Use the record array from the callbck, pass it's length.
    // IMPORTANT: If our current position or count is greater 
    // than array length we go back to 1.   

    if (newValue > parseInt(record.length) || newValue <= 0) {
        newValue = 1;
    }

        currentValue.value = newValue;
        getRecordByRotatingId(newValue);

    });
}

最后：我们将结果显示在屏幕上：此代码只是将增量值传递给get method，并显示引用当前ID的数据：

注意：这是开发代码，我没有使用所有的回调事件，例如：在try catch中我故意不使用catch块中的e.message。

   function getRecordByRotatingId(value) {

        var output = document.getElementById('output');
        output.textContent = "";

        var IDBOpenRequest = indexedDB.open(Database.Name, Database.Version);

        IDBOpenRequest.onerror = function () {
            dbStatusMessage('Database failed to open.', 1000);
        };

        IDBOpenRequest.onsuccess = function (e) {

            var objectStore = getObjectStore(Database.Store.USGeological,
                Database.ReadOnly, e.target.result);

            var request = objectStore.get(value);

            request.onsuccess = function () {

                try {

                    output.innerHTML = '<b>State ID:</b> ' + 
                        request.result.StateId +  ' <br> ' +
                        '<b>State:</b>  ' + request.result.StateName + 
                        ' <br> ' + '<b>Abbreviation:</b>   ' + 
                        request.result.StateAbbreviation;

                } catch (e) {

                    dbStatusMessage('Data does not exist.', 1000);
                }
            };

            request.onerror = function () {
                dbStatusMessage('Data does not exist.', 1000);
            };

            e.target.result.close();
        };
}

此代码在使用大数据结果集的生产中会受到性能影响，因为每次单击下一个或上一个时它都会调用光标。我们可以将总记录数放入内存（本地存储），并在每次加载页面时更新。

更新在上面的初始更新之后，我发现您还可以使用索引计数方法获取对象库中的总记录：有了这个，我已经将方法合并为一个方法：

IDBIndex.count()

function getRecordByNextId(val) {

    var IDBOpenRequest = indexedDB.open(Database.Name, Database.Version);

    IDBOpenRequest.onerror = function () {
        dbStatusMessage('Database failed to open.', 1000);
    };

    IDBOpenRequest.onsuccess = function (e) {

        var output = document.getElementById('output');
        output.textContent = "";

        var objectStore = getObjectStore(Database.Store.USGeological,
            Database.ReadOnly, e.target.result);

        var myIndex = objectStore.index('StateName');
        var request = myIndex.count();

        request.onsuccess = function () {

            var currentValue = document.getElementById('currentValue');
            var newValue = parseInt(currentValue.value, 10) + val;

           if (newValue > parseInt(request.result) || newValue <= 0) {
                newValue = 1;
            }

            currentValue.value = newValue;

            var dataRequest = objectStore.get(parseInt(currentValue.value));

            dataRequest.onsuccess = function (e) {

                output.innerHTML = '<b>State ID:</b> ' + dataRequest.result.StateId
                    + ' <br> ' + '<b>State:</b>  ' + dataRequest.result.StateName +
                    ' <br> ' + '<b>Abbreviation:</b>   ' +
                    dataRequest.result.StateAbbreviation;
            };
        };


        e.target.result.close();
    };
}

Answer 1

嗯，我发现你的问题不是很清楚，但也许这只是我。如果我完全理解你，也许我可以建议你做以下的事情：

function iterateEmployees(db) {
  var tx = db.transaction(DB_STORE_NAME);
  var store = tx.objectStore(DB_STORE_NAME);
  var request = store.openCursor();
  request.onsuccess = function(event) {
    var cursor = event.target.result;
    if(cursor) {
      var employee = cursor.value;
      printEmployeeDetails(employee);
      cursor.continue(); // advance the cursor by 1
    } else {
      // no more employees, or no employees found at all
      doSomethingAfterListingEmployees();
    }
  };
}

function printEmployeeDetails(employee) {
  output.innerHTML += '<p>Id: ' + employee.employeeId + '</p>' +
    'etc ...';
}

编辑，在阅读评论后，您可能想要做的是了解cursor.advance。见https://developer.mozilla.org/en-US/docs/Web/API/IDBCursor/advance。你可以做的是每次用户点击按钮时打开一个光标，然后通过每次用户点击按钮时递增的计数器前进。

JavaScript：如何将增量值传递并重置为IndexedDB存储get方法？

1 个答案: