js部分：
(function(){
var db={};
var DB=null;
function support(){
if(!window.openDatabase){
alert('not support the DB');
return false;
}else{
return true;
}
}
if(!support()){
return;
}
db.creatDB=function(name, version, displayName, maxSize){
DB=openDatabase(name, version, displayName, maxSize);
}
db.createTable=function(tname, items){
var query ="create table if not exists "+tname+" ("+items+")";
DB.transaction(function(tx){
tx.executeSql(query);
});
}
db.insert=function(tname, value){
DB.transaction(function(tx){
if(value instanceof Array){
for(var i=0, len=value.length; i<len; i++){
var singleArr='';
for(pro in value[i]){
if(!value[i][pro]){
singleArr+=",' '";
}else if(isNaN(value[i][pro])){
singleArr+=",'"+value[i][pro]+"'";
}else{
singleArr+=","+value[i][pro];
}
}
singleArr=singleArr.slice(1);
var query="insert into "+tname+" values("+singleArr+")";
console.log(query);
tx.executeSql(query);
}
}else if(value instanceof Object){
var singleArr='';
for(pro in value){
if(!value[pro]){
singleArr+=",' '";
}else if(isNaN(value[pro])){
singleArr+=",'"+value[pro]+"'";
}else{
singleArr+=","+value[pro];
}
}
singleArr=singleArr.slice(1);
tx.executeSql("insert into "+tname+" values("+singleArr+")");
}
});
}
db.selectq=function(tname,callback){
DB.transaction(function(tx){
tx.executeSql("select * from "+tname,[],callback);
});
}
db.detable=function(tname){
DB.transaction(function(tx){
tx.executeSql("drop table "+tname);
});
}
window.theDB=db;
})();
function callbackT(tx,result){
var htm="<table border='1' cellspacing='1'><th>Name</th><th>Value</th>";
for(var i=0;i<result.rows.length;i++){
var item=result.rows.item(i);
htm+="<tr><td width='100'>"+item.name+"</td><td width='100'>"+item.value+"</td></tr>"
}
htm+="</table>";
document.getElementById("result").innerHTML=htm;
}
$(document).ready(function(e) {
theDB.creatDB('db','1.0','my database',2*1024*1024);
$("#deTable").click(function(){
theDB.detable('test');
});
$("#addInfo").click(function(){
theDB.insert('test',[{name:'jhon', value:'one'},{name:'alice',value:'two'},{name:'lilei',value:'tree'}]);
})
$("#addTable").click(function(){
theDB.createTable('test', "name, value");
});
$("#showData").click(function(){
theDB.selectq('test',callbackT);
})
});
html部分：
<body>
<h1>Web SQL Database</h1>
<div id="info">test info</div>
<div id="result"></div>
<div><span id="deTable">删除数据表格 </span><span id="addTable"> 添加表格 </span><span id="addInfo"> 添加数据到表格</span><span id="showData">数据展示</span></div>
</body>
扫一扫
418
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
