Einführung in die Datenbankspeicheranwendung von HTML5 Local Storage_HTML5-Tutorial-Fähigkeiten

//Datenbank öffnen
var db = openDatabase('contactdb','','local database',204800)
//Daten speichern
function save());
var user_name = document.getElementById("user_name").value;
var mobilephone = document.getElementById("mobilephone").value;
var company = document.getElementById("company").value ;
//Erstellungszeit
var time = new Date().getTime();
db.transaction(function(tx){
tx.executeSql('insert into contact value(?, ? ,?,?)',[user_name,mobilephone,company,time],onSuccess,onError);
}
//Die Rückruffunktion wird ausgeführt, nachdem die SQL-Anweisung erfolgreich ausgeführt wurde
function onSuccess(tx,rs){
alert("Vorgang erfolgreich");
loadAll();
}
//Die Rückruffunktion, die ausgeführt wird, nachdem die SQL-Anweisung fehlgeschlagen ist
function onError(tx ,error){
alert("Vorgang fehlgeschlagen, Fehlermeldung: "
}

//Alles speichern in Alle Kontakte in der SQLLite-Datenbank abrufen
function loadAll(){
var list = document.getElementById("list");
db.transaction(function(tx){
//if Wenn die Datentabelle nicht existiert, erstellen Sie die Datentabelle
tx.executeSql('create table if not exist contact(name text,phone text,company text,createtime INTEGER)',[]);
//Alle Kontakte abfragen Personendatensatz
tx.executeSql('select * from contact',[],function(tx,rs){
if(rs.rows.length>0){
var result = "result = "SeriennummerNameMobiltelefon Company< /th>Zeit hinzufügenOperation";
for(var i=0;ivar row = rs.rows.item(i);
//Konvertieren Sie die Zeit und formatieren Sie die Ausgabe
var time = new Date(
time.setTime(); row.createtime );
var timeStr = time.format("yyyy-MM-dd hh:mm:ss");/Füge die Zeilenknoten einer Tabelle zusammen
result = "" row.name "" row.phone "" row .company "< ;/td>" timeStr "< /td>";
}
list.innerHTML = result;
}else{
list.innerHTML = "Die Daten sind derzeit leer, beginnen Sie mit dem Hinzufügen von Kontakten schnell";
}
});
});
}

{
var o = {
"M " : this.getMonth() 1, //month
"d " : this.getDate( ), //Tag
„h“ : this.getHours(), //Stunde
“m“ : this.getMinutes(), //Minute
“s“ : this.getSeconds(), //second
"q " : Math.floor((this.getMonth() 3)/3), //quarter
"S" : this.getMilliseconds() //millisecond
}
if(/(y )/ .test(format)) format=format.replace(RegExp.$1,
(this.getFullYear() "").substr(4 - RegExp.$1.length)); 🎜>for(var k in o )if(new RegExp("(" k ")").test(format))
format = format.replace(RegExp.$1,
RegExp.$1.length= =1 ? o[k] :
("00" o[k]).substr(("" o[k]).length)); 🎜>
Schließlich ist die Schnittstelle Der Implementierungseffekt ist wie folgt:



Um einen bestimmten Kontakt zu implementieren, müssen Sie den folgenden JS-Code ausführen
:

Für den Tabellenstil im obigen Screenshot: Bitte beachten Sie den folgenden CSS-Code
: