Question

我有一个带有“是”“否”单选按钮的字段集。我需要“不”在它自己的字段集中显示一个隐藏的textarea，但我只能通过它来显示所有字段集中所有隐藏的textareas。
这就是我想要的，但它不起作用：

 $(document).ready(function(){
      $(".failRadio").click(function(){
         var nextTextArea = $(this).next().find(".describe");
         $(nextTextArea).show(500);
      });
  });



            <fieldset>
                <legend>One</legend>
                <ol>
                    <li>
                        <label for="pass">Pass</label>
                        <input id="pass" name="foo1" type="radio">
                    </li>
                    <li>
                        <label for="fail">Fail</label>
                        <input id="fail" name="foo1" type="radio" class="failRadio" />
                    </li>
                    <li><textarea style="display: none;" class="describe">Describe:</textarea></li>
                </ol>
            </fieldset>
            <fieldset>
                <legend>Two</legend>
                <ol>
                    <li>
                        <label for="pass">Pass</label>
                        <input id="pass" name="foo1" type="radio">
                    </li>
                    <li>
                        <label for="fail">Fail</label>
                        <input id="fail" name="foo1" type="radio" class="failRadio" />
                    </li>
                    <li><textarea style="display: none;" class="describe">Describe:</textarea></li>
                </ol>
            </fieldset>

Answer 1

你可以这样做：

$(".failRadio").click(function(){
    $(this).closest('ol').find(".describe").show(500);
});

Answer 2

我认为在获得兄弟姐妹之前，你需要在li标签上升一级：

var nextTextArea = $(this).parent().next().find(".describe");

Answer 3

使用此...

$(".failRadio").on('click', function(){
    $('textarea').hide(500);
    $(this).parent().next().find("textarea").show(500);
});

请参阅 DEMO

具有多个字段集的表单。需要隐藏/显示下一个textarea onClick，而不是所有隐藏的textareas

3 个答案: