如何使用JavaScript或jQuery在循环中调用所选的类或名称？

我的javascript代码如下所示：

$('input[name="is_follow_up"]').change(function(){
    var val = $(this).val(),
        input = $('.input-reason');
    if (val == 'n') 
        input.show()
    else 
        input.hide();
});
$('.select-reason').change(function(){
    var reason = $(this).val(),
        others = $('.textarea-others');
    if (reason == 4) {
        others.show();
        $(this).removeAttr('name');
        others.find('textarea').attr('name', 'reason');
    }
    else {
        others.hide()
        $(this).attr('name', 'reason');
        others.find('textarea').removeAttr('name');
    }
});

@foreach($orders as $order)
...
    <label class="radio-inline">
        <input type="radio" name="is_follow_up" id="inlineRadio1" value="y" required checked> accept
    </label>
    <label class="radio-inline">
        <input type="radio" name="is_follow_up" id="inlineRadio2" value="n" required> reject
    </label>
    <div class="row input-reason" style="display: none">
        <div class="col-sm-2">Reason:</div>
        <div class="col-sm-5">
            <div class="form-group">
                <select class="form-control select-reason" name="reason">
                    <option value="Reason 1">Reason 1</option>
                    <option value="Reason 2">Reason 2</option>
                    <option value="Reason 3">Reason 3</option>
                    <option value="4">Reason 4</option>
                </select>
            </div>
            <div class="form-group textarea-others" style="display: none">
            <textarea rows="5" class="form-control"></textarea>
            </div>
        </div>
    </div>
...
@endforeach

我的html代码如下所示：

$('input[name="is_follow_up"]').change(function(){
    var val = $(this).val(),
        input = $('.input-reason');
    if (val == 'n') 
        input.show()
    else 
        input.hide();
});
$('.select-reason').change(function(){
    var reason = $(this).val(),
        others = $('.textarea-others');
    if (reason == 4) {
        others.show();
        $(this).removeAttr('name');
        others.find('textarea').attr('name', 'reason');
    }
    else {
        others.hide()
        $(this).attr('name', 'reason');
        others.find('textarea').removeAttr('name');
    }
});

@foreach($orders as $order)
...
    <label class="radio-inline">
        <input type="radio" name="is_follow_up" id="inlineRadio1" value="y" required checked> accept
    </label>
    <label class="radio-inline">
        <input type="radio" name="is_follow_up" id="inlineRadio2" value="n" required> reject
    </label>
    <div class="row input-reason" style="display: none">
        <div class="col-sm-2">Reason:</div>
        <div class="col-sm-5">
            <div class="form-group">
                <select class="form-control select-reason" name="reason">
                    <option value="Reason 1">Reason 1</option>
                    <option value="Reason 2">Reason 2</option>
                    <option value="Reason 3">Reason 3</option>
                    <option value="4">Reason 4</option>
                </select>
            </div>
            <div class="form-group textarea-others" style="display: none">
            <textarea rows="5" class="form-control"></textarea>
            </div>
        </div>
    </div>
...
@endforeach

@foreach（$orders作为$order）
...
接受
拒绝
原因:
理由1
理由2
理由3
理由4
...
@endforeach

如果我有5个数据顺序。将有5次迭代。 若我在第一次迭代中选择reject，它将在所有迭代中显示textarea

我想：

如果用户在第一次迭代中选择拒绝，则在第一次迭代中仅显示textarea

若用户在第三次迭代中选择“拒绝”，则在第三次迭代中仅显示textarea

等

---

我该怎么做呢？

使用

这个
上下文：（希望我能把你带到这里）

试试这个

  $('.select-reason').change(function(){
    var reason = $(this).val(),
        others = $('.textarea-others');
    if (reason == 4) {
        others.show();
        $(this).removeAttr('name');
        $(this).closest('div').next().find('textarea').attr('name', 'reason');
    }
    else {
        others.hide()
        $(this).attr('name', 'reason');
        $(this).closest('div').next().find('textarea').removeAttr('name');
    }
    });

事实上，有很多方法可以通过
closest（）、parent（）
等找到特定的div，但我在这里做什么（简单地说）：


您的
此
是
选择原因
元素
最近的（'div'）将是

下一步（）转到

然后
find（）
查找您要查找的文本区域

请看，如果您使用
这个
上下文，那么它就很简单，因为它只适用于已更改的元素。以前，
$（'.textarea others'）
将选择页面中的所有文本区域

PS：除非您更改html并在select和textarea之间添加另一个div，
next（）
将立即指向新的div，否则这将起作用

与
相同的是后续更改：

$('input[name="is_follow_up"]').change(function(){
  var val = $(this).val(),
      input = $('.input-reason');
   if (val == 'n') 
     $(this).closest('div.display-someblock').find('.input-reason').show();
   else 
     input.hide();
});

为了方便起见，我使用

@foreach（$orders作为$order）
...
接受
.....
首先，您使用的是
@foreach循环
，在循环内部，您给的是
单选按钮
相同的
名称
，这是不正确的，因为所有单选按钮都具有相同的名称，因此一次只能检查一个单选按钮

在这种情况下，您可以将迭代的索引附加到单选按钮的名称，并将名称命名为
name=“is\u follow\u up1”、name=“is\u follow\u up2”
，依此类推

您可以在使用php时参考获取迭代值

类似地，您必须对选择框和文本区域执行相同的操作，以便它们可以唯一地标识，就像下面的我的代码片段一样，您可以引用它来更新HTML

另外，我在一些元素中添加了
iteration属性
，以获取代码片段中的值

稍后，您可以更新Jquery代码，如代码片段中所示，以获得所需的功能

如果您对此有任何疑问，请告诉我


$（文档）.ready（函数（）{
$（'input[name^=“is_follow_up”]”）。更改（函数（）{
var val=$（this.val（），
迭代=$（this.attr（'iteration'），
输入=$（“.输入原因”+迭代）；
如果（val='n'）
input.show（）
其他的
input.hide（）；
});
$（'select[name^=“reason”]”）。更改（函数（）{
var reason=$（this.val（），
迭代=$（this.attr（'iteration'），
其他=$（'.textarea其他'+迭代）；
如果（原因==4）{
其他。show（）；
$（this.removeAttr（'name'）；
其他.find（'textarea'）.attr（'name'，'reason'）；
}否则{
其他。隐藏（）
$（this.attr（'name'，'reason'）；
其他.find（'textarea'）。removeAttr（'name'）；
}
});
});

接受
拒绝
原因:
理由1
理由2
理由3
理由4
接受
拒绝
原因:
理由1
理由2
理由3
理由4
接受
拒绝
原因:
理由1
理由2
理由3
理由4
试着计算班级人数或name@Rush.2707，我还是很困惑。你应该提供一个详细的答案，我试试看。但它仍然不起作用。查看我的完整html如下：@SuccessMan好的，html是不同的。这不好。无论如何，删除我创建的div。而不是
$（this）.closest（'div.display-someblock'）.find（'input-reason'）.show（）使用
$（this）.closest（'div.row'）.next（）.find（'.input reason'）.show（）
@bipen你不认为如果他将特定的HTML代码循环3次，并给单选按钮赋予相同的名称，他将只能从所有3个组中选择一个单选按钮。