开发者

Jquery table td id

开发者 https://www.devze.com 2023-03-26 05:39 出处:网络
I have a table in which each tr is a record and each td is a column. When I use the click event and click on tr, I need both tr id and the 6th column td id.

I have a table in which each tr is a record and each td is a column. When I use the click event and click on tr, I need both tr id and the 6th column td id.

Both tr and td id should be assigned to a variable.

How to do this with a jQuery selector?

Is this correct?

$(‘tr td).(‘click’, function (
{
});

Any help would be be appreciated. I tried this too:

$('tr td:nth-ch开发者_Go百科ild(5)')

... but it didn't work.


HTML:

<table border="1">
    <tr id="row1">
        <td id="a1">A1</td>
        <td id="b1">B1</td>
        <td id="c1">C1</td>
        <td id="d1">D1</td>
        <td id="e1">E1</td>
        <td id="f1" class="sixth">F1</td>
    </tr>
    <tr id="row2">
        <td id="a2">A2</td>
        <td id="b2">B2</td>
        <td id="c2">C2</td>
        <td id="d2">D2</td>
        <td id="e2">E2</td>
        <td id="f2" class="sixth">F2</td>
    </tr>
    <tr id="row3">
        <td id="a3">A3</td>
        <td id="b3">B3</td>
        <td id="c3">C3</td>
        <td id="d3">D3</td>
        <td id="e3">E3</td>
        <td id="f3"class="sixth">F3</td>
    </tr>
</table>

jQuery:

$(document).ready(function(){

    $('tr').click(function(){
        rowID = $(this)[0].id;
        celID = $(this).children('td:eq(5)')[0].id;
        alert('Row '+rowID+'\nCell '+celID);
    });

});

See jsFiddle. (NOTE: The class="sixth" but was just for debugging and display purposes in jsFiddle.

NOTE: Revised solution after question was clarified by OP: jsFiddle

$(document).ready(function(){

  $('td:nth-child(6)').click(function(){
    alert( $(this)[0].id );
  });

}):


var row = $(this).closest('tr');
var cell = row.find('td:nth-child(6)');

Note that :nth-child() is 1-based, not 0-based, so use (6).

I'm posting on an iPad which doesn't lend itself to code-snippets, else I'd give you a more complete solution!

0

精彩评论

暂无评论...
验证码 换一张
取 消