• javascript 完全正确的数据库indexedDB


      1 //indexedDB
      2 var dbName = 'whx', version = '1', dbTableName = 'bbg', request, db, conCls, updateKey, fun = new Fun();
      3 function openDbs(){//请求数据库
      4     fun.elem('codeId').innerHTML += '打开数据库<br />';
      5     
      6     request.onupgradeneeded = function(e){
      7         fun.elem('codeId').innerHTML += '新的版本号<br />';
      8         var t = e.target.result;
      9         if(!t.objectStoreNames.contains(dbTableName)){
     10             var dbB = t.createObjectStore(dbTableName, {
     11                 keyPath : 'id',
     12                 autoIncrement : true
     13             });
     14             dbB.createIndex('id','id',{unique : false});
     15             fun.elem('codeId').innerHTML += '创建新表<br />';
     16         }
     17     }
     18     
     19     request.onsuccess = function(e){
     20         fun.elem('codeId').innerHTML += '旧的版本号<br />';
     21         db = e.target.result;//数据库对象
     22         fun.elem('codeId').innerHTML += '保存数据库对象<br />';
     23     }
     24     
     25     request.onerror = function(){
     26         fun.elem('codeId').innerHTML += '打开数据库失败<br />';
     27     }
     28     
     29     fun.display('consTxtId','none');//add content in table
     30     fun.value('sltId','','set');//add content in table
     31     fun.display('dbConId','block');//db btn
     32 }
     33 
     34 function close(){//关闭
     35     db.close();
     36     fun.elem('codeId').innerHTML += '关闭数据库<br />';
     37     db.onclose = function(){//没用...
     38         alert('close read');
     39     }
     40 }
     41 
     42 function deleteDb(){//删除
     43     indexedDB.deleteDatabase(dbName);
     44     fun.elem('codeId').innerHTML += '删除数据库<br />';
     45 }
     46 
     47 function showTb(){//查看表内容
     48     var setTable = db.transaction(dbTableName,'readwrite');//设置表权限
     49     fun.elem('codeId').innerHTML += '设置表权限<br />';
     50     
     51     var getTable = setTable.objectStore(dbTableName);//获取表对象
     52     fun.elem('codeId').innerHTML += '获取表对象<br />';
     53     
     54     var cursor = getTable.openCursor();//创建游标
     55     fun.elem('codeId').innerHTML += '创建游标<br />';
     56     
     57     fun.elem('codeId').innerHTML += '获取表信息<br />';
     58     
     59     fun.value('sltId','','set');
     60     
     61     cursor.onsuccess = function(e){
     62         var cursorObj = e.target.result;//获取游标对象
     63         console.log(cursorObj);
     64         if(cursorObj != null){
     65             fun.elem('sltId').innerHTML += "id : " + cursorObj.value.id + ", content : " + cursorObj.value.content + " <span onclick='conUpdate("+cursorObj.key+")'>修改</span> || <span onclick='conDelete("+cursorObj.key+")'>删除</span><br /><br />";
     66             if(cursorObj.key == 2){
     67                 //console.log(cursorObj.value);
     68             }
     69             cursorObj.continue();//游标移动下一个条
     70         }
     71     }
     72     
     73     cursor.onerror = function(){
     74         fun.elem('codeId').innerHTML += '创建游标失败<br />';
     75     }
     76 }
     77 
     78 function addCon(con){//添加
     79     var setTable = db.transaction(dbTableName,'readwrite');//设置表权限
     80     fun.elem('codeId').innerHTML += '设置表权限<br />';
     81     
     82     var getTable = setTable.objectStore(dbTableName);//获取表对象
     83     fun.elem('codeId').innerHTML += '获取表对象<br />';
     84     
     85     var conSet = getTable.add(con);
     86     conSet.onsuccess = function(){
     87         showTb();
     88         fun.elem('codeId').innerHTML += '添加内容成功<br />';
     89     }
     90 }
     91 
     92 function updateCon(key,con){//修改
     93     var setTable = db.transaction(dbTableName,'readwrite');//设置表权限
     94     fun.elem('codeId').innerHTML += '设置表权限<br />';
     95     
     96     var getTable = setTable.objectStore(dbTableName);//获取表对象
     97     fun.elem('codeId').innerHTML += '获取表对象<br />';
     98     
     99     var update = getTable.put({content : con.content, id : key});
    100     update.onsuccess = function(){
    101         showTb();
    102         fun.elem('codeId').innerHTML += "修改key:"+key+"内容成功<br />";
    103     }
    104 }
    105 
    106 function deleteCon(key){//删除
    107     var setTable = db.transaction(dbTableName,'readwrite');//设置表权限
    108     fun.elem('codeId').innerHTML += '设置表权限<br />';
    109     
    110     var getTable = setTable.objectStore(dbTableName);//获取表对象
    111     fun.elem('codeId').innerHTML += '获取表对象<br />';
    112     
    113     var dlt = getTable.delete(key);
    114     dlt.onsuccess = function(){
    115         showTb();
    116         fun.elem('codeId').innerHTML += "删除key:"+key+"内容成功<br />";
    117     }
    118 }
    119 
    120 
    121 //------------------------------------------------btn-------------------------------------------
    122 fun.elem('openDbId').onclick = function(){//request indexedDb btn
    123     if('indexedDB' in window){
    124         request = indexedDB.open(dbName,version);
    125         openDbs();
    126     }else{
    127         alert('当前浏览器不支持indexedDB!');
    128     }
    129 }
    130 
    131 fun.elem('ddId').onclick = function(){//delete database btn
    132     fun.value('codeId','','set');
    133     fun.display('dbConId','none');
    134     deleteDb();
    135     close();
    136 }
    137 
    138 fun.elem('closeId').onclick = function(){//close database btn
    139     fun.value('codeId','','set');
    140     fun.display('dbConId','none');
    141     close();
    142 }
    143 
    144 fun.elem('tbId').onclick = function(){//tables btn
    145     showTb();
    146 }
    147 
    148 fun.elem('aitId').onclick = function(){//add content in table btn
    149     if(fun.elem('consTxtId').style.display == 'block'){
    150         conCls = '';
    151         fun.display('consTxtId','none');
    152         fun.value('conMsgId','','set');
    153     }else{
    154         conCls = 'add';
    155         fun.value('conMsgId','添加 : ','set');
    156         fun.display('consTxtId','block');
    157     }
    158 }
    159 
    160 fun.elem('confirmAddId').onclick = function(){//confirm btn
    161     if(fun.elem('conId').value == ''){
    162         alert('内容为空');
    163     }else{
    164         var con = {content : fun.elem('conId').value};
    165         if(conCls != undefined){
    166             if(conCls == "add"){
    167                 addCon(con);
    168             }
    169             if(conCls == "update"){
    170                 if(updateKey != undefined){
    171                     updateCon(updateKey,con);
    172                 }
    173             }
    174             fun.display('consTxtId','none');
    175             fun.elem('conId').value = '';
    176         }
    177     }
    178 }
    179 
    180 //content  btn
    181 function conUpdate(key){//修改 btn
    182     conCls = 'update';
    183     updateKey = key;
    184     fun.value('conMsgId','修改 : ','set');
    185     fun.display('consTxtId','block');
    186 }
    187 function conDelete(key){//删除 btn
    188     deleteCon(key);
    189 }
    190 </script>
  • 相关阅读:
    使用servicename连接Oracle数据库
    使用SID连接Oracle数据库
    使用xlrd模块
    【Project Euler 8】Largest product in a series
    Git使用帮助
    【Project Euler 1】Multiples of 3 and 5
    VSCode使用新体验
    导出牛顿引力形式为平方反比的两种方式
    NOIP2018游记
    即将退役声明
  • 原文地址:https://www.cnblogs.com/weihexinCode/p/12317444.html
Copyright © 2020-2023  润新知