Javascript JQuery：如何在单击表中该行内的单选按钮时将类应用于特定数据

我有一张有记录的桌子。我试图在单击表行中的单选按钮时，将css类应用于该行中的数据。但是现在发生的是css应用于所有记录

现在，我们可以看到下面的TR值为lion，我希望禁用的类仅在单击该字段行的单选按钮时应用于该span类

但是现在发生的是，禁用的类被应用于该span类，但应用于所有行。我希望那个类只适用于那一行

下面是一个示例和我尝试的内容：

$（'tr'）。单击（函数（）{
$（'.show animals.animal click'）.addClass（'disabled'）；
});

不
不
不
选择
。显示动物。使用单击的行中的动物单击

您需要指定用于添加类的特定行

    $('tr').click(function () {

    $(this).addClass('disabled');  
     });

看看我在这里做了什么，伙计

试试这个：

$('tr').on('click', function() {  
  if ( $(this).find('input').val() == 'Lion' ) {
    $(this).find('.show-animals .animal-click').toggleClass('disabled')
  }
});

更好的方法是，使用钩子（thru id或class属性）连接到特定的跨度：

<div class="label show-animals" id="animalClass">
    <div class="animal-data">
        <span id="disable-me" class="animal-click disable-me">No</span>
        <tr>
           <td>
             <input type="text" value="Lion"></input>
           </td>
        </tr>
    </div>
</div>

此外，请确保没有元素共享相同的ID，以便可以单独引用它们。使用具有相同ID（ID=animalClass）的元素是一种不好的做法。
您的元素是无效的HTML。标识符在HTML中必须是唯一的，并且您正在将事件处理程序绑定到所有
tr
元素。我建议您在target
tr
中添加一个公共类，查看我的答案助手，我将再次编辑您的代码片段，确保您下次没有
input
标记的结束标记。Hello@void:这将帮助我单击该行。我需要它点击单选按钮在那一行。我刚刚添加了代码，需要添加类。我的应用程序是JSF的。我无法添加完整的代码。所以我只是发布了所需的代码。Morelese Rubillos:它不起作用。我需要它一次点击单选按钮，点击一行来添加类。为什么你的代码上没有单选按钮？我刚刚添加了需要添加类的代码。我的应用程序是JSF的。我无法添加完整的代码。所以我刚刚发布了requiredok ok等一下伙计我现在已经更新了我的小提琴。检查一下。这就是你想要的吗？告诉我你想要改变什么，伙计
$('tr').on('click', function() {  
  if ( $(this).find('input').val() == 'Lion' ) {
    $(this).find('.show-animals .animal-click').toggleClass('disabled')
  }
});

<div class="label show-animals" id="animalClass">
    <div class="animal-data">
        <span id="disable-me" class="animal-click disable-me">No</span>
        <tr>
           <td>
             <input type="text" value="Lion"></input>
           </td>
        </tr>
    </div>
</div>

$( '#disable-me' ).on( 'click', function( { $( this ).toggleClass( 'disabled' ) } ) );