怎么通过更改新增数据的代码达到修改数据的效果,我是小白..

疯不觉y 发布于 2016/10/25 10:24
阅读 78
收藏 0
通过以下代码 实现修改数据   增加搜索选项






<!DOCTYPE html>
<html>
  <head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> 
<title></title> 
<style>
table{border-collapse:collapse;}
td{border:1px solid #0000cc;padding:5px}
#message{color:#ff0000}
</style>
<script src="jquery-1.10.2.min.js"></script>
<script type="text/javascript">
$(function () { 
//打开数据库
var dbSize=2*1024*1024;
db = openDatabase('firstDB', '', '', dbSize);
 
db.transaction(function(tx){  
//创建数据表
tx.executeSql("CREATE TABLE IF NOT EXISTS customer (id integer PRIMARY KEY,name char(10),address varchar(200))"); 
showAll();
});




$( "button" ).click(function () {
var name=$("#name").val();
var address=$("#address").val();
if(name=="" || address==""){
$("#message").html("**请输入姓名和地址**");
return false;
}


db.transaction(function(tx){  
//新增数据
tx.executeSql("INSERT INTO customer(name,address) values(?,?)",[name,address],function(tx, result){
$("#message").html("新增数据完成!")
showAll();
},function(e){
$("#message").html("新增数据错误:"+e.message)
}); 
});
})


$("#showData").on('click', ".delItem", function() {
var delid=$(this).prop("id");
db.transaction(function(tx){  
//刪除数据
var delstr="DELETE FROM customer WHERE id=?";
tx.executeSql(delstr,[delid],function(tx, result){
$("#message").html("刪除数据完成!")
showAll();
},function(e){
$("#message").html("刪除数据错误:"+e.errorCode);
}); 
});
})
function showAll(){
$("#showData").html("");
db.transaction(function(tx){  
//显示customer数据表全部数据
tx.executeSql("SELECT id,name,address FROM customer",[], function(tx, result){
if(result.rows.length>0){
var str="现有数据:<br><table><tr><td>id</td><td>姓名</id><td>地址</id><td>&nbsp;</id></tr>";
for(var i = 0; i < result.rows.length; i++){
item = result.rows.item(i);
str+="<tr><td>"+item["id"] + "</td><td>" + item["name"] + "</td><td>" + item["address"] + "</td><td><input type='button' id='"+item["id"]+"' class='delItem' value='刪除'></td></tr>";
}
str+="</table>";
$("#showData").html(str);
}
},function(e){
$("#message").html("SELECT语法出错了!"+e.message)
}); 
});
}


})
</script>  
</head>
<body>
<h3>数据新增与删除</h3>
请输入姓名和地址:
<table>
<tr>
<td>姓名:</td>
<td><input type="text" id="name"></td>
</tr>
<tr>
<td>地址:</td>
<td><input type="text" id="address"></td>
</tr>
</table>
<button id='new'>发送</button>
<p>
<div id="message"></div> 




<div id="showData"></div>
</body>
</html>

加载中
返回顶部
顶部