你的位置:首页 > ASP.net教程

[ASP.net教程]JQuery增删改查


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html "http://www.w3.org/1999/xhtml"><head>  <title></title>  <style type ="text/css">    *{ margin:0px; padding:0px;}    #menu li{ width:50px; height:40px; margin-left:2px; text-align:center;          list-style:none; line-height:40px;   background-color:Green; float:left;}      #msg{ width:90px; height:20px; border:solid 1px red; line-height:20px; text-align:center;}  </style>  <script type ="text/javascript">    function chekcPwd(v) {      var s = v.value;      s = s.toUpperCase();      var a = 0;var b = 0;var cd = 0; //计数器      for (var i = 0; i < s.length; i++) {        var c = s.charCodeAt(i);        if (c >= 65 && c <= 90) {          a=1;//字母        }        else if (c >= 48 && c <= 57)         {           b=1;//数字         }        else {           cd=1; //其它字符        }       }       var d = document.getElementById("msg");       if (a + b + cd == 3) {         d.innerHTML = "强".fontcolor("red") ;       }       else if (a + b + cd == 2) {       d.innerHTML = "中".fontcolor("yellow");       }       else {       d.innerHTML = "弱".fontcolor("red");       }    }  </script>  <script type ="text/javascript">    function overImg(v) {      var i = 50;      var si = setInterval(function () {        i += 2;        v.height = i;        if (i >= 200) {          clearInterval(si);        }      }, 10);    }  </script>  <script type ="text/javascript">    function $(id) {      return document.getElementById(id);    }    function c(n)    {      return document.createElement(n);    }    var currentEditTr = null;//目前正在编辑的行    function addData() {      var n = $("name").value;      var list = $("list");      var td =c("td");      var tr =c("tr");      var td2 = c("td");      var delInput = c("input");      var editInput = c("input");      delInput.type = "button";      delInput.value = "删除";      delInput.onclick = function () {        // alert(1);        if (confirm("确定删除吗?")) {          list.tBodies[0].removeChild(tr);          alert("成功!!!");        }      };       editInput.type = "button";      editInput.value = "编辑";      editInput.onclick = function () {        $("name").value = tr.childNodes[0].innerHTML;        currentEditTr = tr;      };      td2.appendChild(delInput);      td2.appendChild(editInput);      td.innerHTML = n;      tr.appendChild(td);      tr.appendChild(td2);      list.tBodies[0].appendChild(tr);     }     function updateData() {      var n = $("name").value;      if (currentEditTr != null) {        //有编辑的项        currentEditTr.childNodes[0].innerHTML = n;      }    }  </script></head><body><ul id="menu"><li>网页</li><li>MP3</li><li>视频</li><li>图片</li></ul><table>  <tr>    <td width="100"  height="100" style=" text-align:center; vertical-align:bottom;">      内容    </td>  </tr></table> <input type="password" onkeyup="chekcPwd(this)" /><div id="msg"></div>  <img src="images/114.jpg" height="50" onmouseover="overImg(this)" />  <table id="list" border="1">   <tr>    <th>姓名 </th><th>操作</th>  </tr>    </table>  <input type ="text" id="name" />   <input type ="button" value="新增" onclick="addData()" />  <input type="button" value="修改" onclick="updateData()" /></body></html>