如何使用JQuery，动态增加表格的列
先上我的jsp源码
<!doctype html> <html> <head> <meta charset="utf-8"> <title>无标题文档</title> <style type="text/css"> body{ text-align:center; font-size:14px; } .issue{ width:72px; } .red { width:18px; height:18px; background-color:#D40000; } .blue { width:18px; height:18px; background-color:#7FDFFF; } .fenxi{ width:18px; height:18px; } </style> </head> <body> <table border="0" cellspacing="0" cellpadding="0" align="center"> <tr> <td> <table border="1" cellspacing="0" cellpadding="0"> <tr> <td class="issue" rowspan="2">期号</td> <td class="red" colspan="6">红球</td> <td rowspan="2" class="blue">蓝球</td> </tr> <tr> <td class="red">一</td> <td class="red">二</td> <td class="red">三</td> <td class="red">四</td> <td class="red">五</td> <td class="red">六</td> </tr> <tr> <td class="issue">2013080</td> <td class="red">01</td> <td class="red">04</td> <td class="red">10</td> <td class="red">13</td> <td class="red">21</td> <td class="red">31</td> <td class="blue">13</td> </tr> <tr> <td class="issue">2013081</td> <td class="red">04</td> <td class="red">13</td> <td class="red">14</td> <td class="red">20</td> <td class="red">22</td> <td class="red">30</td> <td class="blue">06</td> </tr> </table> </td> <td> <table border="1" cellspacing="0" cellpadding="0"> <tr> <td rowspan="2" bgcolor="#FF7F00" class="fenxi">一位</td> <!-- 在此处加入动态的列 --> <td class="fenxi" colspan="2">奇偶</td> <td class="fenxi" colspan="2">升降</td> <td class="fenxi" colspan="3">012路</td> <td class="fenxi" rowspan="2" bgcolor="#FF7F00">尾数</td> <td class="fenxi" rowspan="2">大</td> <td class="fenxi" rowspan="2">小</td> <td class="fenxi" colspan="3">012路</td> <td colspan="10">尾数分布</td> <td class="fenxi" rowspan="2" bgcolor="#FF7F00">振幅</td> <td class="fenxi" rowspan="2">升</td> <td class="fenxi" rowspan="2">降</td> <td class="fenxi"colspan="3">012路</td> </tr> <tr> <td>奇</td> <td>偶</td> <td>升</td> <td>降</td> <td>0</td> <td>1</td> <td>2</td> <td>0</td> <td>1</td> <td>2</td> <td class="fenxi">0</td> <td class="fenxi">1</td> <td class="fenxi">2</td> <td class="fenxi">3</td> <td class="fenxi">4</td> <td class="fenxi">5</td> <td class="fenxi">6</td> <td class="fenxi">7</td> <td class="fenxi">8</td> <td class="fenxi">9</td> <td>0</td> <td>1</td> <td>2</td> </tr> <tr> <td bgcolor="#FF7F00" class="fenxi"> </td> <td class="fenxi"> </td> <td class="fenxi"> </td> <td class="fenxi"> </td> <td class="fenxi"> </td> <td class="fenxi"> </td> <td class="fenxi"> </td> <td class="fenxi"> </td> <td class="fenxi" bgcolor="#FF7F00"> </td> <td class="fenxi"> </td> <td class="fenxi"> </td> <td class="fenxi"> </td> <td class="fenxi"> </td> <td class="fenxi"> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td class="fenxi" bgcolor="#FF7F00"> </td> <td class="fenxi"> </td> <td class="fenxi"> </td> <td class="fenxi"> </td> <td class="fenxi"> </td> <td class="fenxi"> </td> </tr> <tr> <td bgcolor="#FF7F00" class="fenxi"> </td> <td class="fenxi"> </td> <td class="fenxi"> </td> <td class="fenxi"> </td> <td class="fenxi"> </td> <td class="fenxi"> </td> <td class="fenxi"> </td> <td class="fenxi"> </td> <td class="fenxi" bgcolor="#FF7F00"> </td> <td class="fenxi"> </td> <td class="fenxi"> </td> <td class="fenxi"> </td> <td class="fenxi"> </td> <td class="fenxi"> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td class="fenxi" bgcolor="#FF7F00"> </td> <td class="fenxi"> </td> <td class="fenxi"> </td> <td class="fenxi"> </td> <td class="fenxi"> </td> <td class="fenxi"> </td> </tr> </table> </td> </tr> </table> </body> </html>
这里有一个表格，表格的最后两行是示例数据（这些数现在暂时是固定点，以后会通过数据库查询得到，是变化的），我的想法是：比较红球一这列的连个数字01 04，应该插入4列，并且在01显示在2013080这一行，新插入列的第一列，04显示在2013081这一行，新插入列的第四列，这里只是举了一个例子说明，实际上，这两个数的差应不止这么多，应该插入的列也不会只是4列，
我希望可以用JQuery来写，不过如果您有更好的办法，也可以
也许您看出来了，我这个是模仿双色球的网站做的，我也是一个新手，只是自己给自己找的一个项目作为学习的目标，希望你们不要笑话！
慕运维8079593浏览 886回答 3
3回答
-
交互式爱情
最简单的办法就是每次都重新画你的表格。 -
扬帆大鱼
其实你可以直接用finereport来做，要方便一些
随时随地看视频慕课网APP
相关分类
JavaScript