现在的位置: 首页 > 综合 > 正文

使用jquery交换两行内容(实现行移动)

2013年09月26日 ⁄ 综合 ⁄ 共 1102字 ⁄ 字号 评论关闭

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

<script language="javascript" src="jquery.min.js"></script>
<script language="javascript">

function exchangeRow(row1,row2){ 
 if (row1.attr("tagName") == "TR" && row2.attr("tagName") == "TR" &&
     row1.children("td").length == row2.children("td").length){
  
  //var temp = new Array();
  
  for (i=0;i<row1.children("td").length;i++)
  {
   temp=row1.children("td").eq(i).text();
   row1.children("td").eq(i).text(row2.children("td").eq(i).text());
   row2.children("td").eq(i).text(temp);
  }
  //alert(row1.children("td").length);
 }
}

</script>
</head>

<body>

<table id="mdx" border="1">

<tr id="title">
    <th> name </th>
    <th> sex </th>
    <th> age </th>
</tr>

<tr id="row1">
    <td> madixin </td>
    <td>  gg      </td>
    <td  id="zzz">   25     </td>
</tr>

<tr id="row2">
    <td> huayajing </td>
    <td>  mm      </td>
    <td>   23     </td>
</tr>

<tr id="row3">
    <td> t-mac </td>
    <td>  mm      </td>
    <td>   29     </td>
</tr>

</table>

<script language="javascript">
   
exchangeRow($("#row1"),$("#row3"));

</script>

</body>
</html>

抱歉!评论已关闭.