如何为Onclick访问已单击TR的第一个TD

how to access of the first TD of the clicked TR for Onclick

本文关键字：TR 第一个 TD 单击 Onclick 访问      更新时间：2023-09-26

我有一个表;当我点击一个tr时，我需要改变其中第一个td的类;出于某种原因，我需要使用onclick!我不知道如何传递被点击的tr的第一个td或者如果我传递了被点击的tr>我不知道如何改变类的第一个td的类;

我已经尝试了以下不工作;你能在这方面帮助我吗?

JSFIDDLE: http://jsfiddle.net/web_developer_888/8RF5r/2/

<table>
    <tr onclick="myFunction(this.id)">
        <td></td>
        <td>4</td>
        <td>5</td>
        <td>6</td>        
    </tr>
    <tr onclick="myFunction(this.id)">
        <td></td>
        <td>1</td>
        <td>2</td>
        <td>3</td>        
    </tr>
    <tr onclick="myFunction(this.id)">
        <td></td>
        <td>7</td>
        <td>8</td>
        <td>9</td>        
    </tr>    
</table>

function myFunction(id)
{
 if (id.hasClass('checked')) {
            id..siblings(":first").addClass('checked');
        } else {    
            id.siblings(":first").removeClass('checked');
        }
}

PS:我知道我的代码不对;我只是需要你的帮助;我不知道如何传递被点击的tr的第一个td或者如果我传递被点击的tr

如何获得第一个td或被点击的tr

您正在传递id，这将是一个字符串，因此不会有hasClass函数。只需传递this，然后将其封装在函数中，也可以使用toggleClass

切换类
<tr onclick="myFunction(this)">
    <td></td>
    <td>7</td>
    <td>8</td>
    <td>9</td>        
</tr>

JS 

function myFunction(element){
   $(element).find("td:first").toggleClass("checked");
}

JSFiddle

虽然设置侦听器可能比使用属性onclick

更容易
$("tr").click(function(){
   $(this).find("td:first").toggleClass("checked");
});

或

function myFunction(){
   $(this).find("td:first").toggleClass("checked");   
}
$("tr").click(myFunction);

在这两种情况下，关键字this将是对被单击元素的引用。从那里你只需使用正确的选择器选择第一个td，然后切换类。

既然您有jQuery作为这个问题的标记，我假设您可以使用jQuery。在这种情况下，您可以将单击侦听器附加到行，找到该行的第一个td子类并更改类。

$(document).on('click', 'tr', function() {
    var myTD = $(this).find("td:first");
    if(myTD.hasClass('checked')) {
        myTD.addClass('checked');
    } else {
        myTD.removeClass('checked');
    }
});
相关文章：