<!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>无标题文档</title>
</head>
<body>
<table width="300" border="1">
<tr>
<td style="width:50px">编号</td>
<td style="width:150px">姓名</td>
<td style="width:100px">操作</td>
</tr>
<tr>
<td style="width:50px">1</td>
<td style="width:150px">张三</td>
<td style="width:100px"><input type="submit" value="修改" onclick="tal(this)" /></td>
</tr>
<tr>
<td style="width:50px">2</td>
<td style="width:150px">李四</td>
<td style="width:100px"><input type="submit" value="修改" onclick="tal(this)" /></td>
</tr>
</table>
<script src="jquery-1.8.3.min.js" type="text/javascript"></script>
<script>
function tal(obj){
//定位当前tr
var tds = $( obj ).parent().parent();
var td=tds.find( "td" );
//获取当前td值
var td1=td.eq(0).html();
var td2=td.eq(1).html();
//定义td内的表单
var tdvalue1=td1;
var tdvalue2="<input id='td2' type='text' value='"+td2+"'>";
var tdvalue3="<input type='submit' value='提交' onclick='talvalue(this)'>";
//重新赋值
td.eq(0).html(tdvalue1);
td.eq(1).html(tdvalue2);
td.eq(2).html(tdvalue3);
}
function talvalue(obj){
//定位当前tr
var tds = $( obj ).parent().parent();
var td=tds.find( "td" )
//获取表单值
var data1=td.eq(0).html();
var data2=td.eq(1).find("input").val();
//重新赋值
td.eq(0).html(data1);
td.eq(1).html(data2);
td.eq(2).html("<input type='submit' value='修改' onclick='tal(this)'>");
}
</script>
</body>
</html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
</head>
<body>
<table width="300" border="1">
<tr>
<td style="width:50px">编号</td>
<td style="width:150px">姓名</td>
<td style="width:100px">操作</td>
</tr>
<tr>
<td style="width:50px">1</td>
<td style="width:150px">张三</td>
<td style="width:100px"><input type="submit" value="修改" onclick="tal(this)" /></td>
</tr>
<tr>
<td style="width:50px">2</td>
<td style="width:150px">李四</td>
<td style="width:100px"><input type="submit" value="修改" onclick="tal(this)" /></td>
</tr>
</table>
<script src="jquery-1.8.3.min.js" type="text/javascript"></script>
<script>
function tal(obj){
//定位当前tr
var tds = $( obj ).parent().parent();
var td=tds.find( "td" );
//获取当前td值
var td1=td.eq(0).html();
var td2=td.eq(1).html();
//定义td内的表单
var tdvalue1=td1;
var tdvalue2="<input id='td2' type='text' value='"+td2+"'>";
var tdvalue3="<input type='submit' value='提交' onclick='talvalue(this)'>";
//重新赋值
td.eq(0).html(tdvalue1);
td.eq(1).html(tdvalue2);
td.eq(2).html(tdvalue3);
}
function talvalue(obj){
//定位当前tr
var tds = $( obj ).parent().parent();
var td=tds.find( "td" )
//获取表单值
var data1=td.eq(0).html();
var data2=td.eq(1).find("input").val();
//重新赋值
td.eq(0).html(data1);
td.eq(1).html(data2);
td.eq(2).html("<input type='submit' value='修改' onclick='tal(this)'>");
}
</script>
</body>
</html>