【问题标题】:How do I get the results of an indexedDb request outside the scope of its callback如何在其回调范围之外获取 indexedDb 请求的结果
【发布时间】:2012-10-08 16:06:21
【问题描述】:

我有一个带有输入框的表单,我想使用 IndexedDb objectStore 中的值自动完成,这适用于两个定位输入框。我使用一个简单的数组可以正常工作,但我想让它与来自 objectStore 的值一起使用。 为此,我必须将可用的值从事务中取出,以便我可以在自动完成功能中循环它们。

1- 如何将事务中的结果放入其余代码中可用的对象中?

2- 我的循环语法是否可以使用“results.value.name.length”(名称是我的 objectStore 索引)来处理结果对象?

通过游标获取 IndexedDb 对象:

var results = [];

var openDbRequest = indexedDB.open(DB_NAME);

openDbRequest.onsuccess = function (e) {
    var db = e.target.result;
    var tran2 = db.transaction("store");
    tran2.objectStore("store").openCursor().onsuccess = function(e) {
        var cursor = e.target.result;
        if (cursor) {
            results = cursor;
            cursor.continue();  
        };
    };                                      
};

自动完成功能

var auto = "";
var auto_disp = "";

function getName(results) {
    var input = document.forms['myform'].name.value;
    var len = input.length;
    if (input.length) {
        for (i=0; i<results.value.name.length; i++){            
            if (results.value.name[i].substr(0,len).toLowerCase() == input.toLowerCase()){
                auto_disp = input + results.value.name[i].substr(len);
                auto = results.value.name[i];
                break;
            }
        }
    }
document.forms['myform'].auto_name.value = auto_disp;
}

function setName() {
 document.forms['myform'].name.value = auto;
 hideAuto();
}

function hideAuto() {
 document.forms['myform'].auto_name.value = "";
}

HTML 表单:

<div style="position: absolute; top: 0; left: 0; width: 200px; z-index: 1;">
 <input type="text" name="name" style="background-color: #fff; border: 1px solid #999; width: 200px; padding: 2px" disabled />
</div>

<div style="position: absolute; top: 0; left: 0; width: 200px; z-index: 2;">
 <input autocomplete="off" type="text" name="auto_name" style="background: none; color:#39f; border: 1px solid #999; width: 200px; padding: 2px" onfocus="getName()"onkeyup="getName()" onkeydown="if (event.keyCode == 13) {setName();};"/>
</div>

更新:尝试了不同的链接,现在我得到了光标,但循环有问题,我没有得到自动完成。

openDbRequest.onsuccess = function (e) {
    var db = e.target.result;

    var tran2 = db.transaction("store");
    tran2.objectStore("store").openCursor().onsuccess = function(e) {

        var cursor = e.target.result;
        if (cursor) { 
            var input = document.forms['myform'].country.value; //the inputted value
            var len = input.length;
            if (input.length) {
                for (i=0; i<cursor.length; i++){            
                    if (cursor.value.nome[i].substr(0,len).toLowerCase() == input.toLowerCase()){
                        auto_disp = input + cursor.value.nome[i].substr(len);
                        auto = cursor.value.nome[i];
                        break;                              
                    }
                }   
            }
            document.forms['myform'].auto_name.value = auto_disp;
            cursor.continue();  
        }   
    };
};

【问题讨论】:

    标签: javascript html indexeddb


    【解决方案1】:

    如果你想在事务范围之外使用它,只需将它添加到一个变量中

    var results = [];
    var openDbRequest = indexedDB.open(DB_NAME);
    openDbRequest.onsuccess = function (e) {
        var db = e.target.result;
        var tran2 = db.transaction("store");
        tran2.objectStore("store").openCursor().onsuccess = function(e) {
             var cursor = e.target.result;
             if (cursor) {
                  results.push(cursor.value) 
                  cursor.continue();
             };
        };
    }; 
    

    在此之后,您将遍历结果对象,一旦检索到所有数据,事务范围将关闭。

    【讨论】:

    • 好吧,我是这么认为的。如何测量对象的数量“results.length”?我没有让循环工作。
    • results.length 应该为您提供集合中元素的数量,请记住,只有在检索到 indexeddb 的数据后,您才能开始迭代 te 集合。我认为这是你的问题
    • 是的...我收到“TypeError: results is undefined”,任何关于如何超越这个的想法,我都会在用户每次输入字母时调用 getName() 函数,所以事务不应该在其中,如果我将它嵌套在事务的 oncomplete() 中,它将被称为未定义。
    • 我正在尝试禁用输入框并执行以下操作: tran2.oncomplete = function(e) { document.forms['myForm'].name.disabled = false;获取名称(结果); };
    • 我想我回到零点,光标或结果总是在事务或 oncomplete() 内部可用,但在外部不可用
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2015-02-05
    • 2013-06-29
    • 2019-06-07
    • 1970-01-01
    相关资源
    最近更新 更多