请选择 进入手机版 | 继续访问电脑版

 找回密码
 注册

只需一步,快速开始

蓝色理想 最新研发动态 用悬赏 三天解决问题 解决访问速度慢 论坛支持农历生日 - 地图任务 - 给官方提建议

论坛活动及任务 归纳网站最新活动 请更新论坛注册邮件 第一季积分兑换活动 - 12周年上海聚会照片

万元奖励等你拿——点点网模板设计大赛 畅销译文征名——让最火的畅销书,印上你的标签 看看有才会员作品,欢迎打分拍砖

查看: 1154|回复: 2

Jquery高手帮帮忙啊,只让表格的指定列可以编辑并ajax保存数据 [复制链接]

778cn 楼主
帖子
84
体力
337
威望
0
发表于 2010-3-21 22:36:04 |显示全部楼层
怎么让指定的列可以编辑,如只让名字这一列可以编辑,望大家帮一下忙啊!谢谢了

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"   
        "http://www.w3.org/TR/html4/loose.dtd">  
<html>  
<head>  
    <title>JQuery示例:可编辑table</title>  
    <link type="text/css" rel="stylesheet" href="css/editTable.css"/>  
    <script type="text/javascript" src="lib/jquery.js"></script>  
</head>  
<style type="text/css">   
th {   
background: #0066FF;   
color: #FFFFFF;   
line-height: 20px;   
height: 30px;   
}   
td {   
padding: 6px 11px;   
border-bottom: 1px solid #95bce2;   
vertical-align: top;   
text-align: center;   
}   
td * {   
padding: 6px 11px;   
}   
tr.alt td{   
background: #ecf6fc;   
}   
tr.over td{   
background: #bcd4ec;   
}   
</style>   
<script type="text/javascript">   
var this_ago;   
var name;   
  
$(document).ready(function(){   
$(".stripe tr").mouseover(function(){   
  
$(this).addClass("over");}).mouseout(function(){   
$(this).removeClass("over");})   
$(".stripe tr:even").addClass("alt");   
  
//加事件(双击替换文本) //:td:first-child   
  
$(".stripe tr td").dblclick(function() {   
if(this_ago!=null){   
if(this_ago!=this){   
huanyuan(this_ago);   
}else{   
//点击同一个先判断当前值和开始值是否相等;不能的话可以修改   
if(name==""||name==null){   
return;   
}else{   
if(inname!=""&&inname!=null){   
  
if(inname!=name){   
  
}else{   
return;   
}   
}else{   
//返回   
return;   
}   
}   
  
}   
}   
  
  
  
if($(this).text()!=""&&$(this).text()!=null){   
var name2=$(this).text();//替换文本框   
if(name2!=""&&name2!=null){   
  
thisthis_ago=this;   
name=name2;   
$(this).empty();   
$(this).append("<input name='name' onchange=getNa(this) value='"+name+"' size='8'>");   
}   
  
}   
  
  
});   
  
})   
  
  
//onchange文本框onchange时调用该方法   
var inname;//文本框的值   
function getNa(para){   
inname=para.value;   
var tdv=document.createTextNode(inname);   
para.replaceNode(tdv);   
}   
//还原   
  
var iname1;   
function huanyuan(obj){   
  
if(inname!=""&&inname!=null){   
if(inname!=name){   
$(obj).empty();   
//判断是否改变   
if(iname1!=inname){   
$(obj).append(inname);   
}else{   
//相等的话说明没改变就要用当前的name来默认   
$(obj).append(name);   
}   
iname1=inname;   
}else{   
$(obj).empty();   
$(obj).append(name);   
}   
  
}else{   
$(obj).empty();   
$(obj).append(name);   
}   
  
}   
  
</script>   
</head>   
  
<body>   
  
<table class="stripe" width="200" border="0" cellpadding="1" cellspacing="1">   
<tr>   
<th width="50">序号</th><th width="150">名字</th>   <th width="150">名字1</th>   <th width="150">名字2</th>   
</tr>   
<tr>   
<td>1</td><td>AAA</td>    <td>AAA</td><td>AAA</td>
</tr>   
<tr>   
<td>2</td><td>BBB</td>    <td>AAA</td><td>AAA</td>
</tr>   
<tr>   
<td>3</td><td>CCC</td>    <td>AAA</td><td>AAA</td>
</tr>   
<tr>   
<td>4</td><td>DDD</td>    <td>AAA</td><td>AAA</td>
</tr>   
<tr>   
<td>5</td><td>EEE</td>    <td>AAA</td><td>AAA</td>
</tr>   
</table>   
</body>   
</html>
778cn 楼主
帖子
84
体力
337
威望
0
发表于 2010-3-21 23:48:59 |显示全部楼层
even odd

一次会选中多列啊,不能只指定一列
帖子
44
体力
187
威望
1
发表于 2010-8-13 11:05:19 |显示全部楼层
  1.         var numTd = $("tbody td:even"); //这个地方是获取所有的偶数列   获得奇数列可以用odd("tbody td:odd"); 这样只是 左边的一列可以编辑
复制代码

[ 本帖最后由 ztslove 于 2010-8-13 11:13 编辑 ]
您需要登录后才可以回帖 登录 | 注册

Archiver|手机版|安久科技提供CDN|blueidea.com ( 京ICP备05002321号 )  

GMT+8, 2012-1-10 14:33 , Processed in 0.672594 second(s), 10 queries , Gzip On.

Powered by Discuz! X2

© 2001-2011 Comsenz Inc.

回顶部