
本文实例讲述了jQuery操作JSON的CRUD用法。分享给大家供大家参考。具体实现方法如下:
代码如下:
Jquery ui
script>
script>
// Author By Eric Liang
id:
name:
sex:
age:
id:
name:
sex:
age:
script>
var jsonObj = { teacher: [
{ id:'1', name: "Eric", sex: "m", age: "40" },
{ id:'2', name: "Ghost", sex: "m", age: "28" },
{ id:'3', name: "Didi", sex: "m", age: "27" }
]};
refresh();
function refresh() {
var persons = jsonObj.teacher;
$("tr[name='person']").remove();
for(var i=0; i
var cur_person = persons[i];
var cur_name = cur_person.name;
var cur_sex = cur_person.sex;
var cur_age = cur_person.age;
var cur_id = cur_person.id;
var idTd = "
"+ cur_id +" | ";
var nameTd = "
"+ cur_name +" | ";
var sexTd = "
"+ cur_sex +" | ";
var ageTd = "
"+ cur_age +" | ";
var deleteAction = "
deleteAction += cur_id +"'" +"删除 | "
var updateAction = "
updateAction += cur_id +"'" +"更新 | "
//alert(deleteAction);
var trStr = "
" + idTd;
trStr += nameTd;
trStr += sexTd;
trStr += ageTd;
trStr += deleteAction;
trStr += updateAction;
//alert(trStr);
$('#personform').append(trStr);
}
}
function checkPersonExist(targetId) {
var persons = jsonObj.teacher;
for(var i=0; i
var cur_person = persons[i];
if(cur_person.id == targetId) {
alert("添加失败! Id"+ targetId + "已经存在!");
return false;
}
}
return true;
}
function addperson() {
var userid = $('#userid').val();
var flag = checkPersonExist(userid);
if(flag == false) {
return false;
}
var username = $('#username').val();
var sex = $('#sex').val();
var age = $('#age').val();
var newPerson = "{id:" + "'"+userid+"'" +","+ "name:"+ "'"+username+"'"+","+ "sex:"+"'"+sex + "'"+"," + "age:"+"'"+age+"'" +"}";
newPerson = eval("(" + newPerson + ")");
//$('#personform').append(trStr);
jsonObj.teacher.push(newPerson);
refresh();
}
function deleteperson(obj) {
//alert(obj.name);
var delId = obj.name;
var persons = jsonObj.teacher;
for(var i=0; i
var cur_person = persons[i];
if(cur_person.id == delId) {
persons.splice(i,1);
}
}
refresh();
}
function updateperson(targetId) {
var updateId = targetId.name;
var persons = jsonObj.teacher;
for(var i=0; i
var cur_person = persons[i];
if(cur_person.id == updateId) {
var cur_id = cur_person.id
var cur_name = cur_person.name;
var cur_sex = cur_person.sex;
var cur_age = cur_person.age;
$('#update_userid').attr('value',cur_id);
$('#update_username').attr('value',cur_name);
$('#update_sex').attr('value',cur_sex);
$('#update_age').attr('value',cur_age);
}
}
}
function update() {
var cur_id = $('#update_userid').val();
var cur_name = $('#update_username').val();
var cur_sex = $('#update_sex').val();
var cur_age = $('#update_age').val();
var persons = jsonObj.teacher;
for(var i=0; i
var userId = persons[i].id;
if(cur_id == userId) {
persons[i].name = cur_name;
persons[i].age = cur_age;
persons[i].sex = cur_sex;
}
}
refresh();
}
script>
希望本文所述对大家的jQuery程序设计有所帮助。
jQuery操作JSON的CRUD用法实例_jquery
jQuery操作JSON的CRUD用法实例_jquery:本文实例讲述了jQuery操作JSON的CRUD用法。分享给大家供大家参考。具体实现方法如下: 代码如下: Jquery ui // Author By Eric Liang id: name: sex: age: id: name: sex:
Top