html5/javascript。使用 indexedDB 时无法插入数据

Question

这是我的代码：

function set() {
    var db;
    var request;
    var store;

    var username = document.getElementById("username");
    var password = document.getElementById("password");
    var newuser = {
        "username": username.value,
        "password": password.value,
    };
    var indexedDB = window.indexedDB || window.webkitIndexedDB || window.mozIndexedDB;
    if ('webkitIndexedDB' in window) {
        window.IDBTransaction = window.webkitIDBTransaction;
        window.IDBKeyRange = window.webkitIDBKeyRange;
    }

    request = indexedDB.open("userdb", 1);
    request.onerror = function(event) {};
    request.onsuccess = function(event) {
        db = event.target.result;
        var transaction = db.transaction(["user"], "readwrite");
        var objectStore = transaction.objectStore("user");
        var addrequest = objectStore.add(newuser);
        addrequest.onsuccess = function(event) {
            alert("Success");
        };
    };
    request.onupgradeneeded = function(event) {
        db = event.target.result;
        store = db.createObjectStore("user", {
            keyPath: "username",
            autoIncrement: false
        });
    };
}

插入数据后，我使用函数get()从indexedDB中获取数据，但是我没有获取到，有什么问题吗？谢谢！

function get() {
    var db;
    var request;
    var store;

    var username = document.getElementById("username");
    var password = document.getElementById("password");
    var indexedDB = window.indexedDB || window.webkitIndexedDB || window.mozIndexedDB;
    if ('webkitIndexedDB' in window) {
        window.IDBTransaction = window.webkitIDBTransaction;
        window.IDBKeyRange = window.webkitIDBKeyRange;
    }

    request = indexedDB.open("userdb", 1);
    request.onerror = function(event) {
        alert("Error Code:" + event.target.errorCode);
    };
    request.onsuccess = function(event) {
        db = event.target.result;
        var transaction = db.transaction("user", IDBTransaction.READ_WRITE);
        var objectStore = transaction.objectStore("user");
        objectStore.get(username.value);
        if (password.value == event.target.result.password)
            alert("Success“);
        else
            alert("Failed");
    };
    request.onupgradeneeded = function(event) {
        alert("Update Success");
    };
}

点击另一个按钮获取data.But后该功能有效data.But我未能获取data.I已将newuser(username:1 password:1)添加到tableuser.But 我无法得到 data.Why？谢谢你的回答。

Answer 1

您的代码实际上确实有效，尽管对于给定的用户名只有一次：在记录成功添加到数据库后，它仍然存在（这是使用 IndexedDB 的重点首先），因此后续尝试执行 set() 会导致 addrequest 对象上的失败事件。这永远不会出现在您的代码中，因为您没有为所述请求定义 onerror 处理程序。

替换...

addrequest.onsuccess = function(event) {
    alert("Success");
};

...与...

addrequest.onerror = function(event) {
        if (console && console.log) { console.log("add op: Fail\n"); }
};
addrequest.onsuccess = function(event) {
    if (console && console.log) { console.log("add op: Success\n"); }
};

... 并看到它发生（我冒昧地将警报替换为控制台输出。在浏览器中按 ctrl-j 打开控制台 window）。

测试于 Chrome 50。

更新

改变get函数如下：

而不是...

objectStore.get(username.value);
if (password.value == event.target.result.password)
    alert("Success“);
else
    alert("Failed");

...写...

var getrequest = objectStore.get(newuser.username);
getrequest.onerror = function(event) {
        if (console && console.log) { console.log("get op: Fail\n"); }
};
getrequest.onsuccess = function(event) {
    if (console && console.log) { console.log("get op: Success\n"); }
};

...它会起作用。

html5/javascript。使用 indexedDB 时无法插入数据

html5/javascript.Failed to insert data while using indexedDB

html

javascript

indexeddb