<! -- Copy the code and run it directly -->
<! 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 = gb2312"/>
<Title>
Move up and move down </title>
<SCRIPT type = "text/JavaScript">
Function
Test1 (ID)
{
VaR ROW =
Document. getelementbyid (ID). parentelement. parentelement. rowindex;
If (ROW = 1 ){
Alert ('
Current maximum value, no need to move up ');
} Else {
// Name column value of the previous row
VaR
Htm1 = Document. getelementbyid ("tab"). Rows [row-1]. cells [1]. innerhtml;
//
Name column value of the current row
VaR
Htm2 = Document. getelementbyid (ID). parentelement. parentelement. cells [1]. innerhtml;
Document. getelementbyid ("tab"). Rows [row-1]. cells [1]. innerhtml = htm2;
Document. getelementbyid (ID). parentelement. parentelement. cells [1]. innerhtml = htm1;
}
}
Function
Test2 (ID)
{
// Or obtain the row number of the current row
VaR ROW =
Document. getelementbyid (ID). parentelement. parentelement. rowindex;
// Or
Obtain the total number of rows in the table.
VaR COUNT = Document. getelementbyid ("tab"). Rows. length;
// If
If the row number of the current row is equal to the total number of rows in the table, the row is not moved down.
If (ROW = (count-1 )){
Alert ('current minimum value, no need to move down ');
} Else {
//
Name column value of the next row
VaR
Htm1 = Document. getelementbyid ("tab"). Rows [row + 1]. cells [1]. innerhtml;
//
Name column value of the current row
VaR
Htm2 = Document. getelementbyid (ID). parentelement. parentelement. cells [1]. innerhtml;
//
The value of the name column of the current row is the value of the next row.
Document. getelementbyid ("tab"). Rows [row + 1]. cells [1]. innerhtml = htm2;
//
The value of the next row is assigned the value of the current row.
Document. getelementbyid (ID). parentelement. parentelement. cells [1]. innerhtml = htm1;
}
}
</SCRIPT>
</Head>
<Body>
<Form
Action = "#" method = "Post">
<Table width = "200" border = "1"
Id = "tab">
<Tr>
<TD> serial number </TD>
<TD> name
Name </TD>
<TD> edit </TD>
</Tr>
<Tr>
<TD> 1 </TD>
<TD> name1 </TD>
<TD>
<Input
Id = "up1" type = "button" name = "up1" onclick = "test1 ('up1 ');"
Value = "Move Up">
<Input id = "down1" type = "button" name = "down"
Onclick = "Test2 ('down1 ');" value = "Move Down">
</TD>
</Tr>
<Tr>
<TD> 2 </TD>
<TD> name2 </TD>
<TD>
<Input id = "up2" type = "button" name = "up1" onclick = "test1 ('up2 ');"
Value = "Move Up">
<Input id = "down2" type = "button" name = "down"
Onclick = "Test2 ('down2 ');" value = "Move Down"> </TD>
</Tr>
<Tr>
<TD> 3 </TD>
<TD> name3 </TD>
<TD>
<Input id = "up3" type = "button" name = "up1" onclick = "test1 ('up3 ');"
Value = "Move Up">
<Input id = "down3" type = "button" name = "down"
Onclick = "Test2 ('down3');" value = "Move Down"> </TD>
</Tr>
<Tr>
<TD> 4 </TD>
<TD> name4 </TD>
<TD>
<Input id = "up4" type = "button" name = "up" onclick = "test1 ('up4 ');"
Value = "Move Up">
<Input id = "down4" type = "button" name = "down"
Onclick = "Test2 ('down4');" value = "Move Down"> </TD>
</Tr>
<Tr>
<TD> 5 </TD>
<TD> name5 </TD>
<TD>
<Input id = "up5" type = "button" name = "up1" onclick = "test1 ('up5 ');"
Value = "Move Up">
<Input id = "down5" type = "button" name = "down"
Onclick = "Test2 ('down5');" value = "Move Down"> </TD>
</Tr>
<Tr>
<TD> 6 </TD>
<TD> name6 </TD>
<TD>
<Input id = "up6" type = "button" name = "up1" onclick = "test1 ('up6 ');"
Value = "Move Up">
<Input id = "down6" type = "button" name = "down"
Onclick = "Test2 ('down6');" value = "Move Down"> </TD>
</Tr>
<Tr>
<TD> 7 </TD>
<TD> name7 </TD>
<TD>
<Input id = "up7" type = "button" name = "up1" onclick = "test1 ('up7 ');"
Value = "Move Up">
<Input id = "down7" type = "button" name = "down"
Onclick = "Test2 ('down7');" value = "Move Down"> </TD>
</Tr>
<Tr>
<TD> 8 </TD>
<TD> name8 </TD>
<TD>
<Input id = "up8" type = "button" name = "up1" onclick = "test1 ('up8 ');"
Value = "Move Up">
<Input id = "down8" type = "button" name = "down"
Onclick = "Test2 ('down8');" value = "Move Down"> </TD>
</Tr>
<Tr>
<TD> 9 </TD>
<TD> name9 </TD>
<TD>
<Input id = "up9" type = "button" name = "up1" onclick = "test1 ('up9 ');"
Value = "Move Up">
<Input id = "down9" type = "button" name = "down"
Onclick = "Test2 ('down9');" value = "Move Down"> </TD>
</Tr>
</Table>
</Form>
</Body>
</Html>