关闭

jquery的简单使用

262人阅读 评论(0) 收藏 举报
分类:
  <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
  <html>
  <head>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  <script language="JavaScript" src="../js/jquery-1.10.2.js"></script>
  <title>添加用户</title>
  </head>
  <body>
  <center>
  <br><br>
  添加用户:<br><br>
  姓名: <input type="text" name="name" id="name" />&nbsp;&nbsp;
  email: <input type="text" name="email" id="email" />&nbsp;&nbsp;
  电话: <input type="text" name="tel" id="tel" /><br><br>
  <button id="addUser">提交</button>
  <br><br>
  <hr>
  <br><br>
  <table id="usertable" border="1" cellpadding="5" cellspacing=0>
  <tbody>
  <tr>
  <th>姓名</th>
  <th>email</th>
  <th>电话</th>
  <th>&nbsp;</th>
  </tr>
  <tr>
  <td>Tom</td>
  <td>tom@tom.com</td>
  <td>5000</td>
  <td><a href="deleteEmp?id=Tom">Delete</a></td>
  </tr>
  <tr>
  <td>Jerry</td>
  <td>jerry@sohu.com</td>
  <td>8000</td>
  <td><a href="deleteEmp?id=Jerry">Delete</a></td>
  </tr>
  </tbody>
  </table>
  </center>
  </body>
  <script language="JavaScript">
   
  $("#addUser").click(function(){
  var $name=$("#name").val();
  var $email=$("#email").val();
  var $tel=$("#tel").val();
  var $td=$("<td></td><td></td><td></td><td></td>");
   
  var $tr=$("<tr></tr>");
   
  $td.each(function(index,obj){
   
  if(index==0){
   
  $(this).html($name);
  }
  if(index==1){
   
  $(this).html($email);
  }
  if(index==2){
   
  $(this).html($tel);
  }
   
  if(index==3){
   
  $(this).append( $("<a href='#'>Delete</a>"));
  }
   
  });
  $tr.append($td);
  $("#usertable").append($tr);
  $("#addUser a").each(function (){
   
  });
   
  });
   
  function delU(){
   
  }
  </script>
  </html>
 
0
0

查看评论
* 以上用户言论只代表其个人观点,不代表CSDN网站的观点或立场
    个人资料
    • 访问:277次
    • 积分:13
    • 等级:
    • 排名:千里之外
    • 原创:1篇
    • 转载:0篇
    • 译文:0篇
    • 评论:0条
    文章分类
    文章存档
    阅读排行
    评论排行