利用jquery进行复制表格

代码如下:

思路很简单:利用jquery复制表格_xmlView Code


 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />


<title>无标题文档</title>

<script type="text/javascript" src="../jquery/Script/jquery-1.4.1.js"></script>

<script type="text/javascript">

$(function(){

           alert($("tr:eq(5)").children().eq(0).attr("colspan"))

        /*   alert($("tr:eq(4)").children(1).text())

           alert($("#rowspan2").index())

           alert($("#rowspan2next").index())

           alert($("#rowspan2next").children().eq(0).text())

              alert($("#rowspan2nextnextnext").index())*/

        /*alert( $("#testTr :nth-child(5)").text());

        alert($("tr").length)

        alert($("#testTr").index())*/

        $("#copy").click(function(){

        var rowLength = $("tr").length;

        var index = 0;

         var $table=$("<table></table>")

           

         for(;index<=rowLength;index++)

         {

             var tdindex=0;

             var $tr = $("<tr></tr>")

            for(;tdindex<$("tr").eq(index).children().length;tdindex++) 

            {

                   var $td= $("<td></td>")

                var $reallytd = $("tr").eq(index).children().eq(tdindex);

                $td.attr("colspan",$reallytd.attr("colspan"));

                $td.attr("rowspan",$reallytd.attr("rowspan"));

                $td.text($reallytd.text());

                $tr.append($td);

            }

            

            $table.append($tr);

            

         }

         $("div").append($table);

    }) 

           

           

           })


 


</script>

<style>

table{border:1px solid #0F0; -moz-user-select: none;        }

td,th{border:1px solid #0F0;}


 

</style>


</head>



<body  onselectstart= "return   false ">

<table id='testTable' >

   

    <tr> <td>fdfdfr1</td> <td>fdfdfd</td><td>dffd</td><td>fdfdfd</td><td>dffd</td></tr>

     <tr> <td>fdfdfr2</td> <td>fdfdfd</td><td>dffd</td><td>fdfdfd</td><td>dffd</td></tr>

       <tr id="testTr"> <td colspan="3">fdfdfr3</td> <td>fdfdfd</td><td>dffd</td></tr>

     <tr> <td  colspan="3">fdfdfr4</td>  <td>fdfdfd</td><td>dffd</td></tr>

       <tr id="rowspan2"> <td rowspan="2">fdfdf1212</td> <td>fdfdfd3434r5</td><td>dffd5</td><td>fdfdfd6</td><td>dffd7</td></tr>

     <tr id="rowspan2next"> <td>fdfdfd4444r6</td><td>dffd</td><td>fdfdfd</td><td>dffd</td></tr>

       <tr id="rowspan2nextnext"> <td>fdfdf5r7</td> <td>fdfdfd</td><td>dffd</td><td>fdfdfd</td><td>dffd</td></tr>

         <tr id="rowspan2nextnextnext"> <td>fdfdfr8</td> <td>fdfdfd</td><td>dffd</td><td>fdfdfd</td><td>dffd</td></tr>

  


</table>

<div></div>

<button id="copy">fdfdfd</button>

</body>

</