webSql的简单小例子
初始化websql数据库的参数信息
var config = {
name: 'my_plan',
version: '',
desc: 'manage my plans',
size: 20 * 1024
};
7 var db = window.openDatabase(config.name, config.version, config.desc, config.size);
此函数为创建一个表
function crateTable() {
var sql = 'create table if not exists t_plan(title, content, target_time, create_time)';
db.transaction(function(tx) {
tx.executeSql(sql, null, function(tx, rs) {
console.log('执行sql成功');
}, errorCallback);
});
}
接下来往表里增加一条数据
function addPlan(values) {
var sql = 'INSERT INTO t_plan (title, content, target_time, create_time) VALUES (?,?,?,?)';
db.transaction(function(tx) {
tx.executeSql(sql, values, function(tx, rs) {
var effectRow = rs.rowsAffected;
console.log('影响记录条数:' + effectRow);
effectRow && console.log('执行sql成功');
}, errorCallback);
});
}
查询所以记录代码
function getPlanList() {
var sql = 'SELECT * FROM t_plan';
db.transaction(function(tx) {
tx.executeSql(sql, null, function(tx, rs) {
console.log('list:' + rs.rows);
console.log('item:' + JSON.stringify(rs.rows.item(0)));
}, errorCallback);
});
9 };
删除一条记录
function deletePlan(values) {
var sql = 'DELETE FROM t_plan WHERE title = ?';
db.transaction(function(tx) {
tx.executeSql(sql, values, function(tx, rs) {
var effectRow = rs.rowsAffected;
console.log('影响记录条数:' + effectRow);
effectRow && console.log('执行sql成功');
}, errorCallback);
});
}
修改一条记录
function updatePlan(values) {
var sql = 'UPDATE t_plan SET content = ? WHERE title = ?';
db.transaction(function(tx) {
tx.executeSql(sql, values, function(tx, rs) {
var effectRow = rs.rowsAffected;
console.log('影响记录条数:' + effectRow);
effectRow && console.log('执行sql成功');
}, errorCallback);
});
}
下面附上源码:
<!DOCTYPE html>
<html> <head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<title></title>
<style type="text/css">
input {
display: block;
}
</style>
</head> <body>
<input type="text" id="title" />
<input type="text" id="content" />
<input type="text" id="target_time" />
<button type="button" id="add_plan">add</button>
<button type="button" id="select">select</button>
<script type="text/javascript">
// (function() {
document.getElementById("add_plan").addEventListener('click', function() {
var title = document.getElementById("title").value;
var content = document.getElementById("content").value;
var targetTime = document.getElementById("target_time").value;
var createTime = new Date().getTime(); var values = [title, content, targetTime, createTime];
addPlan(values);
});
document.getElementById("select").addEventListener('click', function() {
getPlanList();
});
// 判定当前环境是否支持websql
// if(!window.openDatabase) {
// console.log('当前环境不支持websql');
// return;
// } var config = { //初始化websql数据库的参数信息
name: 'my_plan',
version: '',
desc: 'manage my plans',
size: 20 * 1024
};
var db = window.openDatabase(config.name, config.version, config.desc, config.size); crateTable(db); function errorCallback(error) {
console.error('error:' + error.message);
} function crateTable() {
var sql = 'create table if not exists t_plan(title, content, target_time, create_time)';
db.transaction(function(tx) {
tx.executeSql(sql, null, function(tx, rs) {
console.log('执行sql成功');
}, errorCallback);
});
} function addPlan(values) {
var sql = 'INSERT INTO t_plan (title, content, target_time, create_time) VALUES (?,?,?,?)';
db.transaction(function(tx) {
tx.executeSql(sql, values, function(tx, rs) {
var effectRow = rs.rowsAffected;
console.log('影响记录条数:' + effectRow);
effectRow && console.log('执行sql成功');
}, errorCallback);
});
} function getPlanList() {
var sql = 'SELECT * FROM t_plan';
db.transaction(function(tx) {
tx.executeSql(sql, null, function(tx, rs) {
console.log('list:' + rs.rows);
console.log('item:' + JSON.stringify(rs.rows.item(0)));
}, errorCallback);
});
}; function deletePlan(values) {
var sql = 'DELETE FROM t_plan WHERE title = ?';
db.transaction(function(tx) {
tx.executeSql(sql, values, function(tx, rs) {
var effectRow = rs.rowsAffected;
console.log('影响记录条数:' + effectRow);
effectRow && console.log('执行sql成功');
}, errorCallback);
});
} function updatePlan(values) {
var sql = 'UPDATE t_plan SET content = ? WHERE title = ?';
db.transaction(function(tx) {
tx.executeSql(sql, values, function(tx, rs) {
var effectRow = rs.rowsAffected;
console.log('影响记录条数:' + effectRow);
effectRow && console.log('执行sql成功');
}, errorCallback);
});
}
// }());
</script>
</body> </html>
webSql的简单小例子的更多相关文章
- php+jquery+ajax+json简单小例子
直接贴代码: <html> <title>php+jquery+ajax+json简单小例子</title> <?php header("Conte ...
- C#利用事件与委托进行窗体间传值简单小例子
本篇博客是利用C#委托与事件进行窗体间传值的简单小例子 委托与事件的详细解释大家可以参照张子阳的博客: http://www.tracefact.net/CSharp-Programming/Dele ...
- ASP.NET Cookie对象到底是毛啊?(简单小例子)
记得刚接触asp.net的时候,就被几个概念搞的头痛不已,比如Request,Response,Session和Cookie.然后还各种在搜索引擎搜,各种问同事的,但是结果就是自己还是很懵的节奏. 那 ...
- 关键字Lock的简单小例子
一.什么是Lock? Lock——字面上理解就是锁上:锁住:把……锁起来的意思: 为什么要锁?要锁干什么?——回到现实中可想象到,这个卫生间我要上,其他人不要进来!(所以我要锁住门):又或者土味情话所 ...
- 详细解读Android中的搜索框(一)—— 简单小例子
这次开的是一个讲解SearchView的栏目,第一篇主要是给一个小例子,让大家对这个搜索视图有一个了解,之后再分布细化来说. 目标: 我们先来定个目标,我们通过搜索框来输入要搜索的联系人名字,输入的时 ...
- 关于ExpandableListView用法的一个简单小例子
喜欢显示好友QQ那样的列表,可以展开,可以收起,在android中,以往用的比较多的是listview,虽然可以实现列表的展示,但在某些情况下,我们还是希望用到可以分组并实现收缩的列表,那就要用到an ...
- Ajax的简单小例子
1.首先下载ajax.dll,一个百度一下都有下载的!自行查找. 2.把ajax.dll导入到工程.右键工程-->添加引用--->浏览,找到下载好的ajax.dll文件,点击确定,这时候在 ...
- SpringMVC静态文件(图片)访问+js访问 简单小例子
项目文件布局: web.xml文件: <?xml version="1.0" encoding="UTF-8"?> <web-app vers ...
- MVC实现(简单小例子)
Here I’ll demonstrate simple Spring MVC framework for building web applications. First thing first. ...
随机推荐
- 无线安全课堂:手把手教会你搭建伪AP接入点
概述 *本文假设读者对设置伪AP接入点以及Apache配置有足够了解. 在本攻击场景中,我们将使用到alfa无线网卡以及用于网络访问的以太网连接(虚拟机环境下,物理机下无需此配置).你也可以使用虚拟接 ...
- ubuntu10.04 建V
ubuntu10.04架设vpn服 vpn 安装: pptpd:apt-get install pptpd 1. 配置网络IP地址,编辑 vim /etc/pptpd.conf ,去掉下面两行前面# ...
- Ckeditor通过Ajax更新数据
之前在表单中对ckeditor的赋值就直接是 $("#theadEditor").val(result); 而如今我想通过点击不同选项来使用Ajax在后台訪问数据.对ckedito ...
- Python - 两个列表(list)组成字典(dict)
使用zip函数, 把key和value的list组合在一起, 再转成字典(dict). 代码: # -*- coding: utf-8 -*- keys = ['a', 'b', 'c'] value ...
- C中多线程开发
1 引言 线程(thread)技术早在60年代就被提出,但真正应用多线程到操作系统中去,是在80年代中期.solaris是这方面的佼佼者.传统的 Unix也支持线程的概念,可是在一个进程(proce ...
- MongoDB 学习笔记一 安装以及基础命令
一.MongoDB安装配置 1.获取最新版本号: wget http://fastdl.mongodb.org/linux/mongodb-linux-x86_64-2.0.2.tgz 2.解压缩就可 ...
- CCBPM工作流引擎的消息机制与设计
keyword:ccflowjflow 消息机制流程引擎 自己主动发送短信 发送邮件 发送消息 流程引擎微信连接 消息接口 关于ccbpm: 我们把ccflow jflow两个版本号的工作流引擎统称为 ...
- JavaScript基础 -- js常用内置方法和对象
JS中常用的内置函数如下: 1.eval(str):计算表达式的结果. 2.parseInt(str,n):将符串转换成整数数字形式(可指定几进制). 3.parseFloat(str):将字符串转换 ...
- ionic2 在执行ionic serve后报 build dev failed: Cannot set property 'fileSystem' of null
ionic2 真是烦人,因为环境依赖的问题还有网络的问题,不知砸的,项目放一段事件不运行就会出问题. 我一开始是 用 cnpm install安装的依赖,其中也报了错, 然后执行 ionic serv ...
- 上百例Silverlight网站及演示汇总,供友参考
毁灭2012 博客园 首页 新闻 新随笔 联系 管理 订阅 随笔- 125 文章- 0 评论- 446 上百例Silverlight网站及演示汇总,供友参考 今天我将发现的Silverlig ...