使用WebSQL輸入數據

我在爲我的Chrome擴展使用WebSQL時遇到了一些麻煩。（這是用我的第一次）我發現這個教程中，我試圖使它適應我的需求：http://www.html5rocks.com/en/tutorials/webdatabase/todo/使用WebSQL輸入數據

繼承人我的代碼：

var favourites = {}; 
favourites.webdb = {}; 

favourites.webdb.db = null; 

favourites.webdb.open = function() { 
    var dbSize = 5 * 1024 * 1024; // 5MB 
    favourites.webdb.db = openDatabase("favourites", "1", "Favourites Database", dbSize); 
}; 

favourites.webdb.onError = function(tx, e) { 
    alert("There has been an error: " + e.message); 
}; 

favourites.webdb.onSuccess = function(tx, r) { 
    // re-render the data. 
    // loadTodoItems is defined in Step 4a 
    favourites.webdb.getAllTiles(loadTiles); 
}; 


favourites.webdb.createTable = function() { 
    var db = favourites.webdb.db; 
    db.transaction(function(tx) { 
    tx.executeSql("CREATE TABLE IF NOT EXISTS " + 
        "tiles(ID INTEGER PRIMARY KEY ASC, name, colour, width, linkURL, imgURL)", []); 
    }); 
}; 


favourites.webdb.addTile = function(tileName, tileColour, tileWidth, tileLinkURL, tileImgURL) { 
    var db = favourites.webdb.db; 
    db.transaction(function(tx){ 
    tx.executeSql("INSERT INTO tiles(name, colour, width, linkURL, imgURL) VALUES (?,?,?,?,?)", 
     [tileName, tileColour, tileWidth, tileLinkURL, tileImgURL], 
     favourites.webdb.onSuccess, 
     favourites.webdb.onError); 
    }); 
}; 

function loadTiles(tx, rs) { 
    var rowOutput = ""; 
    var todoItems = document.getElementById("tiles"); 
    for (var i=0; i < rs.rows.length; i++) { 
    rowOutput += renderTile(rs.rows.item(i)); 
    } 

    tiles.innerHTML = rowOutput; 
} 
function renderTile(row) { 
    return "<a href='" + row.tileLinkURL + "'>" + 
     "<div class='mdl-js-button mdl-js-ripple-effect tile' style='background-color:" + row.tileColour + "; width:" + row.tileWidth + "px;'>" + 
     "<img class='tileimg' src='" + row.tileImgURL + "'>" + 
     "</div>" + 
     "</a>"; 
}; 


favourites.webdb.deleteTile = function(id) { 
    var db = favourites.webdb.db; 
    db.transaction(function(tx){ 
    tx.executeSql("DELETE FROM tiles WHERE ID=?", [id], 
     favourites.webdb.onSuccess, 
     favourites.webdb.onError); 
    }); 
}; 


function init() { 
    favourites.webdb.open(); 
    favourites.webdb.createTable(); 
    //favourites.webdb.getAllTiles(loadTiles); 
};

我得到一個錯誤，當我嘗試添加數據到數據庫： http://i.imgur.com/AGoBP9X.png

有人可以解釋我的代碼出了什麼問題嗎？

來源

2016-02-06 Splycd

我的第一個猜測是，即favourites.webdb.db === null，因此沒有方法transaction。

因此，我會檢查是否實際調用了init。（如果是這樣，那麼檢查openDatabase的verison參數是否正確，在我發現的文檔中，它應該是"1.0"而不僅僅是"1"

來源

2016-02-06 21:22:45

我還建議你@Splycd考慮使用IndexedDB而不是WebSQL，因爲w3c組停止使用規範如果您在使用IDB時遇到問題，請嘗試使用Dexie.js，這對於IDB來說是非常有用的包裝。 –

使用WebSQL輸入數據

回答

相關問題