Question

我想迭代一个IndexedDB objectStore，得到结果并填充这个选择框。

这是我的HTML

 <tr>
    <td>
       <select id="opt" name="opt"></select>
    </td>
 </tr>

这是我的JavaScript

function populateOptions() {
  var options = [ "1", "2", "3", "4", "5"];
  var opt = document.getElementById("opt");

  for (var i = 0; i < options.length; i++) {
    var option = document.createElement("option");
    option.value = options[i];
    var optionText = document.createTextNode(options[i]);
    option.appendChild(optionText);
    opt.appendChild(option);
  }

}

populateOptions();

Answer 1

在html中：

<body onload="load()">

在javascript中：

function load(){
    populateOptions();
}

或者很快：

<body onload="populateOptions()">

Answer 2

尝试以下方法：

var dbreq = indexeddb.open("db");
dbreq.onsuccess = function (conn){
    var trans = dbreq.result.transaction(["objectstore"]);
    var obj = trans.objectStore("objectstore");
    var cursor = obj.openCursor();
    cursor.onsuccess = function (e) {
            if (!cursor.result) {
               var opt = document.getElementById("opt"); 
               var option = document.createElement("option");
               option.value = cursor.result.value;                
               var optionText = document.createTextNode(cursor.result.value);                
               option.appendChild(optionText);
               opt.appendChild(option); 
               cursor["continue"]()
            } else {
               // cursor ended
            }
}

或者使用我的linq2indexeddb library并按照以下方式执行操作：

var db = linq2indexedDB("db");
db.linq.from("objectstore").select.then(null, null, function(e){
    var opt = document.getElementById("opt"); 
    var option = document.createElement("option");
    option.value = e.data;                
    var optionText = document.createTextNode(e.data);                
    option.appendChild(optionText);
    opt.appendChild(option); 

});

有关indexeddb的更多信息，我可以访问blog。在这里，我经常发布有关indexedDB API的信息。

如何使用IndexedDB objectStore中的值自动填充选择框？

2 个答案: