第一篇博客，發(fā)下我自己寫(xiě)的jQuery調(diào)用WebService實(shí)現(xiàn)增刪改查的實(shí)現(xiàn)。
1 <!DOCTYPE html> 2 3 <html xmlns="http://www.w3.org/1999/xhtml"> 4 5 <head> 6 7 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 8 9 <title></title> 10 11 <script src="script/jquery-1.10.2.js"></script> 12 13 <script src="script/jquery.validate-vsdoc.js"></script> 14 15 <script src="script/jquery.validate.js"></script> 16 17 18 19 <style type="text/CSS"> 20 21 td { 22 23 width: 200px; 24 25 } 26 27 </style> 28 29 <script type="text/javascript"> 30 31 32 33 //-----------獲取全部用戶信息----------- 34 35 var myData; 36 37 $(document).ready( 38 39 function () { 40 41 $.Ajax({ 42 43 type: 'POST', 44 45 contentType: 'application/json;charset=utf-8', 46 47 url: 'http://localhost:12383/UserService.asmx/GetUser', 48 49 data: '{}', 50 51 dataType: 'json', 52 53 error: function (x, e) { 54 55 alert('系統(tǒng)錯(cuò)誤請(qǐng)聯(lián)系系統(tǒng)管理員') 56 57 }, 58 59 success: function (result) { 60 61 $.each(result.d, function (index, data) {//循環(huán)index是索引，data是值 62 63 myData += 64 65 "<tr id= " + data.Id + "_tr> <td> <input type='checkbox' id='' /> </td>" 66 67 + "<td> " + data.Id + "</td>" 68 69 + "<td class='input'>" + data.Name + "</td>" 70 71 + " <td id='" + data.Id + "_edit' ><span class='delete' style='cursor:pointer' >刪除 </span> <span style='cursor:pointer' class='update'>修改</span> </td>" 72 73 + "</tr>"; 74 75 }); 76 77 $("#tb1").append(myData); 78 79 }