我用Jquery代码向<tbody>元素中添加行,当单击tbody中的a标签的时候要触发一个单击事件,并获取当前行的索引。
请问如何实现啊。
<table id="tbItem" width="100%">
<thead>
<tr><th>选择</th><th>拨出方</th><th>PO</th></tr>
</thead>
<tbody>
<tr><a href="#" name="choice" value="详情"/></td><td>拨出方</td><td>PO</td></tr>
<tr><a href="#" name="choice" value="详情"/></td><td>拨出方</td><td>PO</td></tr>
<tr><a href="#" name="choice" value="详情"/></td><td>拨出方</td><td>PO</td></tr>
<tr><a href="#" name="choice" value="详情"/></td><td>拨出方</td><td>PO</td></tr>
</tbody>
</table>
请问如何实现啊。
<table id="tbItem" width="100%">
<thead>
<tr><th>选择</th><th>拨出方</th><th>PO</th></tr>
</thead>
<tbody>
<tr><a href="#" name="choice" value="详情"/></td><td>拨出方</td><td>PO</td></tr>
<tr><a href="#" name="choice" value="详情"/></td><td>拨出方</td><td>PO</td></tr>
<tr><a href="#" name="choice" value="详情"/></td><td>拨出方</td><td>PO</td></tr>
<tr><a href="#" name="choice" value="详情"/></td><td>拨出方</td><td>PO</td></tr>
</tbody>
</table>
解决方案 »
- JS虚拟键盘退格问题求解决!
- 请教js截取字符串后面所有字符
- 急~~ExtJS 关于时间与double类型转换显示的问题!!!
- 刚看到一个帖子:问求js脚本关闭当前浏览器,不提示询问关闭窗口(IE6.0)。我想问ie7 8 firefox 等关闭浏览器不提示关闭窗口的代码是什么
- IE7中为什么window.open()方法设置属性无效?
- 一个高难度的下拉框的问题,十万紧急,请大家帮忙,先谢谢了
- javascript脚本是否能触发系统声音。。。。????
- 一个简单的问题
- 一个十万火急的问题!!!恳请各位兄弟姐妹们帮忙!!!多谢了!!!!!
- jquery实现 获取选中的div的值
- jquery json
- 求JS控制Submit按钮 点击后10秒无法使用
<BODY>
<table id="myTable">
<Tr><td>1</td><td>2</td><td><a>3</a></td></tr>
<Tr><td>11</td><td>22</td><td><a>33</a></td></tr>
<Tr><td>111</td><td>222</td><td><a>333</a></td></tr>
</table>
<script>
jQuery(document).ready(function(){
jQuery("#myTable a").each(function(index){
jQuery(this).bind("click",function(){
var htmlstr = "";
index++;
jQuery("#myTable tr:nth-child("+index+")").children().each(function(){
htmlstr += jQuery(this).text();
})
alert(index);//获取点击行的索引
alert(htmlstr); // 获取点击行的内容
});
});
});
</script>
</BODY>
var id = $("a").index(this);//获得当前那个a的索引,从0开始
$("tbody").append("<tr>里面的内容自己写吧</tr>");
}
<tr><a href="#" name="choice" value="详情"/></td><td>拨出方</td><td>PO</td></tr>
第一个/td多出来了,而且a标签要有/a结尾的
应该是这样
<tr><a href="#" name="choice" value="详情"/><td>拨出方</td></a><td>PO</td></tr>
你的代码我调试了,是没有问题的,所以你把你JS生成的地方改一下把!
你也可以运行下面的试一下,是没有问题的<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>改变Input Value值</title>
<BODY>
<table width="100%">
<thead>
<tr><th>选择</th><th>拨出方</th><th>PO</th></tr>
</thead>
<tbody id="tbItem">
<tr><a href="#" name="choice" value="详情"/><td>拨出方</td></a><td>PO</td></tr>
<tr><a href="#" name="choice" value="详情"/><td>拨出方</td></a><td>PO</td></tr>
<tr><a href="#" name="choice" value="详情"/><td>拨出方</td></a><td>PO</td></tr>
<tr><a href="#" name="choice" value="详情"/><td>拨出方</td></a><td>PO</td></tr>
</tbody>
</table>
<script>
jQuery(document).ready(function(){
jQuery("#tbItem tr").each(function(index){
jQuery(this).bind("click",function(){
var htmlstr = "";
index++;
jQuery("#tbItem tr:nth-child("+index+")").children().each(function(){
htmlstr += jQuery(this).text();
})
alert(index);//获取点击行的索引
alert(htmlstr); // 获取点击行的内容
});
});
});
</script>
</BODY>
</head>
</html></body>
</html>
所以应该是动态的,1楼的每个a连接的click事件在初始化的时候就迭代写死了~这样的话我在最上面js动态添加一行,去点第二行~第二行还是以为自己是索引1,既然是动态就应该用live,所有的a都live一个函数,函数内容要有这句:var parentTR=this.parent()然后要取索引就用这句$(parentTR).index($('tr'));综上所述
一个live()函数一个index()函数就ok
~没必要1楼整那么多迭代!