jquery怎么根据table的id和tr的id选中一个tr

jquery怎么根据table的id和tr的id选中一个tr,第1张

这个问题我以前也碰到过,试了很多种方法,好像那个tr的id控制没有用

我后来的解决方法是,根据table的id 和 td的id 来选择tr内所有的td

<table style=" width:100%;">

        <TBODY>

<TR>

<TD id=th_SearchAccount_1 class=table_border1_th>录音编号</TD>

<TD id=th_SearchAccount_2 class=table_border1_th>呼出时间</TD>

<TD id=th_SearchAccount_3 class=table_border1_th>用户名称</TD>

<TD id=th_SearchAccount_4 class=table_border1_th>呼出分机</TD>

<TD id=th_SearchAccount_5 class=table_border1_th>呼出号码</TD>

<TD id=th_SearchAccount_6 class=table_border1_th>呼叫类别</TD>

<TD id=th_SearchAccount_7 class=table_border1_th>有效性</TD>

<TD id=th_SearchAccount_8 class=table_border1_th>通话方向</TD>

<TD id=th_SearchAccount_9 class=table_border1_th>通话时长</TD>

<TD id=th_SearchAccount_10 class=table_border1_th>匹配客户</TD></TR>

<TR>

<TD id=td_SearchAccount_0_1>21346</TD>

<TD id=td_SearchAccount_0_2>2015/5/23 17:20:25</TD>

<TD id=td_SearchAccount_0_3></TD>

<TD id=td_SearchAccount_0_4>106</TD>

<TD id=td_SearchAccount_0_5></TD>

<TD id=td_SearchAccount_0_6></TD>

<TD id=td_SearchAccount_0_7></TD>

<TD id=td_SearchAccount_0_8>拨出</TD>

<TD id=td_SearchAccount_0_9>19</TD>

<TD id=td_SearchAccount_0_10>--</TD>

<TD id=td_SearchAccount_0_HasSelect class=table_border1_op><A onclick='SearchAccount_DoTableHasSelect("td_SearchAccount_0_")' href="javascript:void(0);" onFocus="undefined">查看</A></TD></TR>

<TR>

<TD id=td_SearchAccount_1_1>21345</TD>

<TD id=td_SearchAccount_1_2>2015/5/23 17:06:37</TD>

<TD id=td_SearchAccount_1_3></TD>

<TD id=td_SearchAccount_1_4>106</TD>

<TD id=td_SearchAccount_1_5></TD>

<TD id=td_SearchAccount_1_6></TD>

<TD id=td_SearchAccount_1_7></TD>

<TD id=td_SearchAccount_1_8>拨出</TD>

<TD id=td_SearchAccount_1_9>19</TD>

<TD id=td_SearchAccount_1_10>--</TD>

<TD id=td_SearchAccount_1_HasSelect class=table_border1_op><A onclick='SearchAccount_DoTableHasSelect("td_SearchAccount_1_")' href="javascript:void(0);" onFocus="undefined">查看</A></TD></TR></TBODY>

    </table>

这个代码是我页面里面用的代码,也就是给每个 td了一个单独的id

这样只要给出其中一个td的id  那么  我就可以找到相关所有的id

至于 js的代码  你自己去弄下  这个我是给你一个思路

td如果不是生成的就给td 定义一个唯一ID 再通过ID来取比较好。

1、使用css选择器,$("tr td:nth-child(2)")。

2、使用遍历函数eq()。

下面就以上两个方法进行实例演示:单击按钮改变所有行的第二个单元格的样式,单击任意行改变该行第二个单元格的样式。

1、HTML结构

<table id = "test">

<tr><td>1</td><td>1</td><td>2</td><td>3</td></tr>

<tr><td>2</td><td>4</td><td>5</td><td>6</td></tr>

<tr><td>3</td><td>7</td><td>8</td><td>9</td></tr>

<tr><td>4</td><td>1</td><td>2</td><td>3</td></tr>

</table>

<input type="button" id="btn" value="设置">

2、jquery代码

$(function(){

$("#btn")click(function() {

$("#test tr td:nth-child(2)")addClass('red');

});

$("#test tr")click(function() {

$(this)children('td')eq(1)addClass('red');

});

});

你好!!

第一种:直接通过ID选择器  

alert(   $("#textfield")val()   );

第二种:通过层级选择器  表示table下第一行第二列的第一个input的value

alert(   $("table tr:eq(0) td:eq(1) input:eq(0)")val()   );

第三种:通过input限定  表示返回table下第一个input的value

alert(   $("table input:eq(0)")val()   );

用JQuery获取表格最后一行或一列的代码例子

代码如下:

$('#mytable tr:last')find('td')addClass('end');

$('#mytable tr')find('td:last')addClass('end');

获取倒数第二行

代码如下:

$("#tbData tr")get($("#tbData tr")length - 2);

$("#tbData tr")eq(-2);

$(tbody)find('tr')eq(1)find('td')eq(2);

这条代码取的是第1个tr的第2个td

你可以用$(tbody)find('tr')size()取所有tr

然后在循环中取第二个td

有两种方法可以获取tr下的第二个td元素:

1、使用css选择器,$("tr td:nth-child(2)")。

2、使用遍历函数eq()。

下面就以上两个方法进行实例演示:单击按钮改变所有行的第二个单元格的样式,单击任意行改变该行第二个单元格的样式。

1、HTML结构

<table id = "test">

<tr><td>1</td><td>1</td><td>2</td><td>3</td></tr>

<tr><td>2</td><td>4</td><td>5</td><td>6</td></tr>

<tr><td>3</td><td>7</td><td>8</td><td>9</td></tr>

<tr><td>4</td><td>1</td><td>2</td><td>3</td></tr>

</table>

<input type="button" id="btn" value="设置">

2、jquery代码

$(function(){    $("#btn")click(function() {        $("#test tr td:nth-child(2)")addClass('red');    });    $("#test tr")click(function() {        $(this)children('td')eq(1)addClass('red');    });});

<script src=">

以上就是关于jquery怎么根据table的id和tr的id选中一个tr全部的内容,包括:jquery怎么根据table的id和tr的id选中一个tr、jQuery怎么取到第二个tr的其中几个td、jquery获取table的第1行第2列等相关内容解答,如果想了解更多相关内容,可以关注我们,你们的支持是我们更新的动力!

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/web/9708146.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-05-01
下一篇 2023-05-01

发表评论

登录后才能评论

评论列表(0条)

保存