如何使用JQuery显示带有单选按钮的隐藏表行

我有多个表格行，每行有一组单选按钮（批准和拒绝）。当我选择Reject时，我想在它下面显示一个隐藏的tr，我使用jquery将HTML插入tr。当我选择Approve时，tr应该再次隐藏

当我在Approve&Reject单选按钮之间切换时，隐藏的tr将显示在所有行上，我无法让它完全按照我解释的方式工作。我希望它只显示在我点击的单选按钮下面

我的小提琴：

HTML:

应用程序
雷吉
应用程序
雷吉

JQuery：

    $('.hiddenColumn').hide();

    $('input[type=radio]').change(function() {
     if ($(this).val() == 'reject') {
       $('.hiddenColumn').show();
       var showColumn = ($(this).closest('tr').next('tr'));
       showColumn.html('<td class="left">*Reason for Rejection<br /><textarea class="width350" name="reasonForRejection"></textarea></td>');
        } else if ($(this).val() == 'approve') {
            ($(this).closest('tr').next('tr')).hide();
       };
   });

$（'.hiddenColumn'）.hide（）；
$（'input[type=radio]'）。更改（函数（）{
if（$（this）.val（）=='reject'）{
$（'.hiddenColumn'）.show（）；
var showColumn=（$（this）.closest（'tr'）.next（'tr'））；
html（“*拒绝原因
”）；
}else if（$（this）.val（）=='approve'）{
（$（this）.closest（'tr'）.next（'tr'））.hide（）；
};
});

而不是

更改

使用

单击事件并删除这一行
$（'.hiddenColumn'）。show（）
，这是罪魁祸首。只需在已经找到的行上调用show方法来显示下一行。也可以在处理程序中使用
this.value
而不是使用
$（this.val（）
来获取值

   $('input[type=radio]').click(function() {
     var $nextTR = $(this).closest('tr').next('tr');
     if (this.value == 'reject') {
       $nextTR
       .html('<td class="left">*Reason for Rejection<br /><textarea class="width350" name="reasonForRejection"></textarea></td>')
       .show();
     } 
     else if (this.value == 'approve') {
        $nextTR.hide();
     };
   });

$（'input[type=radio]'）。单击（function（）{
var$nextTR=$（this）.closest（'tr'）。next（'tr'）；
如果（this.value==“拒绝”）{
$nextTR
.html（“*拒绝原因
”）
.show（）；
} 
否则如果（this.value==“批准”）{
$nextTR.hide（）；
};
});


   $('input[type=radio]').click(function() {
     var $nextTR = $(this).closest('tr').next('tr');
     if (this.value == 'reject') {
       $nextTR
       .html('<td class="left">*Reason for Rejection<br /><textarea class="width350" name="reasonForRejection"></textarea></td>')
       .show();
     } 
     else if (this.value == 'approve') {
        $nextTR.hide();
     };
   });