jQuery運算JSON的CRUD用法實例_jquery

本文實例講述了jQuery操作JSON的CRUD用法。分享給大家供大家參考。具體實作方法如下：

複製程式碼 程式碼如下:

 
 
 
 
Jquery ui標題> 
 
 
 
頭> 
// 作者：艾瑞克‧梁  
 
     
             
                     
                        id 
                        姓名時 
                        性別     
                        年齡 
                        移除作業   
                        更新作業 
                     
            表> 
    表格> 
    id:    
    名稱： 
    性別： 
    年齡： 
     
 
    id:   > 
    名稱： 
    性別： 
    年齡：  
    ; 
正文> 
 
 
腳本> 
 
       var jsonObj = { 老師: [ 
 { id:'1', 姓名: "Eric", 性別: "m", 年齡: "40" }, 
 { id:'2', 姓名: "Ghost", 性別: "m", 年齡: "28" }, 
 { id:'3', 姓名: "迪迪", 性別: "男", 年齡: "27" } 
    ]}； 
 刷新（）; 
 函數刷新（）{ 
  var people = jsonObj.teacher; 
  $("tr[name='person']").remove(); 
  for(var i=0; i    var cur_person = 人[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 ""; 
   varageTd = "" cur_age ""; 
   var deleteAction = "刪除" 
   var updateAction = "更新" 
   //alert(deleteAction);
   var trStr = "" idTd；
   trStr = 名稱Td； 
   trStr = 性Td； 
   trStr = 年齡Td； 
   trStr = 刪除操作； 
   trStr = 更新作業； 
   //警報（trStr）； 
   $('#personform').append(trStr); 
      } 
 } 
 函數 checkPersonExist(targetId) { 
  var people = jsonObj.teacher; 
  for(var i=0; i    var cur_person = 人[i]; 
   if(cur_person.id == targetId) { 
        alert("新增失敗!Id" targetId "已經存在!"); 
        回傳錯誤；
   }
  } 
  返回真； 
 } 
 函數 addperson() { 
    var userid = $('#userid').val(); 
    var flag = checkPersonExist(使用者ID); 
    if(flag == false) { 
   返回假； 
    } 
      var 使用者名稱 = $('#使用者名稱').val(); 
      var sex = $('#sex').val(); 
      var 年齡 = $('#age').val(); 
var newPerson = "{id:" "'" 使用者ID "'" "," "姓名:" "'" 使用者名稱"'" "," "性別:" "'" 性別"'" "," "年齡:" “'“ 年齡”'” ”}”; 
      newPerson = eval("("newPerson")"); 
      //$('#personform').append(trStr); 
      jsonObj.teacher.push(newPerson); 
      刷新（）; 
 } 
 函數deleteperson(obj) { 
  //警報（物件名稱）； 
  var delId = obj.name; 
  var people = jsonObj.teacher; 
  for(var i=0; i    var cur_person = 人[i]; 
   if(cur_person.id == delId) { 
        people.splice(i,1);
   } 
  } 
  刷新（）; 
 } 
 函數 updateperson(targetId) { 
      var updateId = targetId.name; 
      var people = jsonObj.teacher; 
      for(var i=0; i    var cur_person = 人[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); 
   } 
  } 
 } 
 函數更新（）{ 
      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(); 
 } 

希望本文所述對大家的jQuery程式設計有所幫助。