首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > JavaScript >

怎么用jquery将多个td标签合并成一个带colspan的

2013-01-08 
如何用jquery将多个td标签合并成一个带colspan的table idappletrtdS/tdtd idaA/tdtd i

如何用jquery将多个td标签合并成一个带colspan的
<table id="apple">
  <tr>
    <td>S</td>
    <td id="a">A</td>
    <td id="b">B</td>
    <td id="c">C</td>
  </tr>
  <tr>
    <td>S</td>
    <td id="d">D</td>
    <td id="e">E</td>
    <td id="f">F</td>
  </tr>
</table>

如何用jquery将上面的代码变成
<table id="apple">
  <tr>
    <td>S</td>
    <td id="all" colspan="3">ALL</td>
  </tr>
  <tr>
    <td>S</td>
    <td id="d">D</td>
    <td id="e">E</td>
    <td id="f">F</td>
  </tr>
</table>
[解决办法]

<table id="apple">
  <tr>
    <td>S</td>
    <td id="a">A</td>
    <td id="b">B</td>
    <td id="c">C</td>
  </tr>
  <tr>
    <td>S</td>
    <td id="d">D</td>
    <td id="e">E</td>
    <td id="f">F</td>
  </tr>
</table>
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript">
  google.load("jquery", "1");
  google.load("jqueryui", "1");
</script>
<SCRIPT Language="Javascript">
var ntd = $('<td>')
ntd.attr("id","all")
ntd.attr("colspan",$("#apple").find("tr").eq(0).find("td").index())
ntd.html("ALL")
var oldtd = $("#apple").find("tr").eq(0).find("td").eq(0)
$("#apple").find("tr").eq(0).html("")
$("#apple").find("tr").eq(0).append(oldtd)
$("#apple").find("tr").eq(0).append(ntd)
</SCRIPT>

热点排行