1 <table id="info"> 2 <thead> 3 <th>颜色</th> 4 <th>操作1</th> 5 <th>操作2</th> 6 </thead> 7 <tbody> 8 <td>红色</td> 9 <td><a href="#" onclick="edit(this)">编辑</a></td> 10 <td><a href="#" onclick="del(this)">删除</a></td> 11 </tbody> 12 </table>
function edit(n){
1.想要获取发生点击事件的行数
var tr=n.parentNode.parentNode.rowIndex;
2.获取所在行的第一列的内容
var tr_f=$("#info tr:eq(" + tr + ") td:eq(0)").html();
3.在td标签下添加input标签
$("#info tr:eq(" + tr + ") td:eq(0) ").html("<input type='text' value="+value+"></input>"); //value为变量
}
function save(n){
4.获得所在行下的input的内容
var text=$("#info tr:eq(" + tr + ") td:eq(0)").find("input").val();
5.进行ajax请求
//发送数据给后台
$.ajax({
type: "post", /*or "get"*/
url:URL,
data: {
"name":Jane,
"age":12,
},
dataType: "json",
success: function(data){
//alert('成功');
}
});
}
function del(n){
6.删除所在行
$(n).parent().parent().remove();
}
若想点击事件只发生一次,即可以设置var kaiguan=1;if(kaiguan){……;kaiguan=0;}即可。
//IE文本框只能输入数字
$('.num').keyup(function(){
var c=$(this);
if(/[^d]/.test(c.val())){//替换非数字字符
var temp_amount=c.val().replace(/[^d]/g,'');
$(this).val(temp_amount);
}
})