js做增行和删行 -

hesihua

浏览: 233766 次
性别:
来自: 武汉

最近访客更多访客>>

leoeco2000

gargar

et2000

razorkkk

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

js做增行和删行

博客分类：

javascript

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
 <head>
  <title>test.html</title>
 <script type="text/javascript" src="../../js/jquery-1.4.2.min.js"></script>
 <script type="text/javascript"> 
function query(){
$("#table1 tbody").html("");
var addTR="<tr><td><input type='checkbox' id='tr1'></th><th>姓名1</th><th>男</th><th>20</th></tr>";
addTR= addTR+"<tr><td><input type='checkbox' id='tr2'></th><th>姓名2</th><th>男</th><th>20</th></tr>";
addTR= addTR+"<tr><td><input type='checkbox' id='tr3'></th><th>姓名3</th><th>男</th><th>20</th></tr>";
addTR= addTR+"<tr><td><input type='checkbox' id='tr4'></th><th>姓名4</th><th>男</th><th>20</th></tr>";
$("#table1 tbody").append(addTR);
}

 function setDel()
{
$("#table1").find("input:checked").each(function(){
$(this).parent().parent().html("");
});
}
 function setAdd()
{
var addTR="<tr><td><input type='checkbox' id='tr1'></td><td>新增</td><td>男</td><td>20</td></tr>";
$("#table1 tbody").append(addTR);
}
</script>
 </head>

 <body>
  <fieldset>
   <legend>
    操作
   </legend>
   <input type="button" value="删除" onClick="setDel()" />
   <input type="button" value="添加" onClick="setAdd()" />
   <input type="button" value="查询" onClick="query()" />
  </fieldset>
  <fieldset>
   <legend>
    数据结果
   </legend>
   <table id="table1" bordercolor="1">
    <thead>
     <tr>
      <th>
       操作
      </th>
      <th>
       姓名
      </th>
      <th>
       性别
      </th>
      <th>
       年龄
      </th>
     </tr>
    </thead>
    <tbody>

    </tbody>
   </table>
  </fieldset>
 </body>
 </html>

上面的显示结果就是可以在选择了某一行后进行删除，或者给网格增加一个空行。

分享到：

在linux下面配置java web程序 | java表达式类型转换

2011-12-17 16:50
浏览 659
评论(1)
分类:移动开发
查看更多

1 楼 hesihua 2012-02-03

function setAdd()
{
var addTR="<tr><td><input type='checkbox' id='tr1'></td><td>新增</td><td>男</td><td>20</td></tr>";
$("#table1 tbody").append(addTR);
}
上面在网格中添加一行是一种方式，

下面采用另外一种方式进行添加一行：
var cell = document.createElement("td").appendchild(document.createTextNode("foo"));
var row = document.createElement("tr").appendchild(cell);
document.getElementById("table1").appendchild(row);

这种方式是采用的ajax思想

发表评论

您还没有登录,请您登录后再发表评论

最近访客更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论

js做增行和删行

评论

发表评论

相关推荐

最近访客 更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论

js做增行和删行

评论

发表评论

相关推荐

使用ｊｓＵｎｉｔ测试ｊａｖａｓｃｒｉｐｔ代码

javasccript

javascript中嵌入java代码

最近访客更多访客>>