JQuery操作一个表格

最新推荐文章于 2021-06-20 02:35:24 发布

dduhp02480

最新推荐文章于 2021-06-20 02:35:24 发布

阅读量111

点赞数

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/liydotnet/archive/2008/04/25/1171503.html

版权

JQuery操作一个表格，有一个功能选择－> 取消在ＩＥ下好像没有效果，在ＦＦ下可以使用，不知道是什么原因了，有知道原因的指点一下。


		选择增加一行↑ 复制此行↓ 删除

JQuery操作表格
<script type="text/javascript" src="http://files.cnblogs.com/liydotnet/jquery-1.2.3.js">script>
<style type="text/css">
.mainTable{ background-color:#ffcc00; width:85%; margin:auto; font-size:12px}
.mainTable td{ height:22px}
.line{ background-color:#fffff7; height:25px}
.line-none{ background-color:#fffff7; height:25px}
.selected{ background-color:#fff5fa}
.template{ background-color:#ffffdd;display:none; color:#e8f5fe}
.mainTable a{ margin-right:6px}
.mainTable a:link{color:#92b0dd }
.mainTable a:visited{color:#92b0dd}
.mainTable a:hover{color:#FF0000}
style>
<table class="mainTable" cellspacing="1" cellpadding="1">
    <tbody>
        <tr class="template">
            <td style="padding-left: 5px" colspan="3">td>
        tr>
        <tr class="line">
            <td style="padding-left: 6px">td>
            <td>td>
            <td style="width: 30%" align="center"><a onclick="javascript:do_select(this)" href="javascript:;">选择a> <a onclick="javascript:do_add(this)" href="javascript:;">增加一行↑a> <a onclick="javascript:do_copy(this)" href="javascript:;">复制此行↓a> <a onclick="javascript:do_delete(this)" href="javascript:;">删除a> td>
        tr>
    tbody>
table>
<script type="text/javascript">
function do_select(aa)
{
  var id=$(aa);
  id.parents("tr").addClass("selected");
  id.attr("onclick","javascript:do_reset(this)").html("取消")
}
function do_reset(aa)
{
  var id=$(aa);
  id.parents("tr").removeClass("selected");
  id.attr("onclick","javascript:do_select(this)").html("选择")
}
function do_copy(aa)
{
var id=$(aa);
var copy=id.parents("tr").clone();
var first=copy.find("td:first");
first.html("》"+first.html())
id.parents("tr").after(copy);

}
function do_add(aa)
{
var id=$(aa);
var template=$(".template").clone().attr("class","line-none");
var add=$(".line-none");
id.parents("tr").prev(".line-none").remove();
template.show().find("td:eq(0)").html("我是根据模板复制的的