我也知道可以在td标签上绑定单击事件,然后在td中加入文本框,但是我死活就是绑定不上td,为什么?就包括我在网页上只写一个td,里面写一个按钮,我绑定这个按钮都绑定不上为什么?
这是我在百度找的,也不行啊。点按钮都没效果啊。
序号 | 姓名 | 年龄 | 性别 | 操作 |
---|---|---|---|---|
1 | tom | 18 | 男 | 添加 修改 删除 |
2 | jone | 28 | 男 | 添加 修改 删除 |
3 | lily | 21 | 女 | 添加 修改 删除 |
添加 修改 删除 |
$("table td").click(function(){ 执行……});
你的绑定不上,需要你把你的写法贴出来才能知道原因
<!doctype html>
<html>
<head>
<title></title>
<meta charset="utf-8">
<style type="text/css">
tr{height: 20px;width: 300px;}
td{width: 200px;}
.hid{display: none;}
</style>
<script type="text/javascript" src="scripts/jquery.min.js"></script>
<script type="text/javascript">
$(function(){
//点击添加
$("#add").click(function(){
//01 克隆
alert("1111111");
var $tr = $(".hid").clone(true);
//disply=block
$tr.removeClass("hid");
//把修改按钮的值为保存
$tr.find("button:contains('修改')").html("保存");
//02 after()
$(this).closest("tr").after($tr);
resetIndex();
});
//点击修改
$(".update").click(function(){
//可操作的全部区域
var $tds = $(this).parents("tr").children("td").not(":first,:last");
//点击修改按钮的时候,先判定是修改还是保存
var $content = $(this).html();
if ($content=="修改") {
//如果是修改,给每个操作的td添加一个input标签
$tds.each(function(){
$(this).html("<input type='text' value='"+$(this).html()+"'>")
});
$(this).html("保存")
}else{
//如果是保存,将修改的内容保存下来
$tds.each(function(){
var contentIn= $(this).children("input").val()
$(this).html(contentIn);
});
$(this).html("修改")
}
});
//点击删除
$(".del").click(function(){
$(this).parents("tr").remove();//将对应的一行删除
resetIndex();
});
});
function resetIndex(){
//计算序号
$("tr>td:first-child").each(function(index,element){
$(this).html(index+1)
})
}
</script>
</head>
<body>
<table border="1px" cellspacing="0">
<tr>
<th>序号</th>
<th>姓名</th>
<th>年龄</th>
<th>性别</th>
<th>操作</th>
</tr>
<tr>
<td>1</td>
<td>tom</td>
<td>18</td>
<td>男</td>
<td>
<button class="add">添加</button>
<button class="update">修改</button>
<button class="del">删除</button>
</td>
</tr>
<tr>
<td>2</td>
<td>jone</td>
<td>28</td>
<td>男</td>
<td>
<button class="add">添加</button>
<button class="update">修改</button>
<button class="del">删除</button>
</td>
</tr>
<tr>
<td>3</td>
<td>lily</td>
<td>21</td>
<td>女</td>
<td>
<button class="add">添加</button>
<button class="update">修改</button>
<button class="del">删除</button>
</td>
</tr>
<tr class="hid">
<td></td>
<td><input type="text"></td>
<td><input type="text"></td>
<td><input type="text"></td>
<td>
<button class="add">添加</button>
<button class="update">修改</button>
<button class="del">删除</button>
</td>
</tr>
</table>
</body>
</html>
http://download.csdn.net/download/w172087242/9604430
这个是我之前写的一个编辑的,希望能够帮到你...
如果有帮助,希望采纳,如果有问题,可以继续回馈
你这个#add 是根据id选择的啊 你没有id = add 的
你的add是类名称,又不是id选择器,你用id选择器获取不到dom对象了
$("#add").click(function () {
===>
$(".add").click(function () {
新创建的table表格,最外层假如有一个父级,通过父级来绑定。然后click的时候textarea执行focus();
$('#tableBox').on('click','td',function(){
this.find('textarea').focus();
})
在 html 里你定义 class='add' 但是在jquery里,你是选取ID = add (#add)
就用jquery选择器然后绑定事件,再做操作啊。另外你还是学会百度吧。想要啥都行。这么效率太低了
表格生成完以后再执行绑定事件
$("#表格ID td").on('click',function(){
alert("你想干啥");
});