javascript - 如何选择下一个具有相同类别的元素？

Question

我的问题由两部分组成:

1. 如何选择下一个具有相同类的元素并隐藏前一个？
2. 如何在每个输入的隐藏值中添加按下按钮的值？假设我按下了“否”类的按钮。我希望“否”进入问题的输入隐藏值。怎么做？

非常感谢。任何形式的帮助都将不胜感激。

这是我目前所拥有的:

HTML:

$('.answer_buttons a').on('click', function(e){
    e.preventDefault();
    $('.selected').removeClass('selected').hide().next().show().addClass('selected');
    $.ajax({
        type: "POST",
        url: '',
        data: {},
        success: function(msj){
            //alert('test');
            //console.log(msj);
        }
    });
});

<form action="" method="post">
  <input name="intr1" value="" type="hidden">
  <p class="question selected" id="intreb_1">
    Intrebarea 1?</p>
  <input name="intr2" value="" type="hidden">
  <p class="question " id="intreb_2">
    Intrebarea 2?</p>
  <input name="intr3" value="" type="hidden">
  <p class="question " id="intreb_3">
    Intrebarea 3?</p>
  <input name="intr4" value="" type="hidden">
  <p class="question " id="intreb_4">
    Intrebarea 4?</p>
  <input name="intr5" value="" type="hidden">
  <p class="question " id="intreb_5">
    Intrebarea 5?</p>
  <div class="answer_buttons">
    <a class="nu" href=""></a>
    <a class="da" href=""></a>
  </div>
</form>

Answer 1

您似乎想选择当前 .question.selected 元素的下一个兄弟 .question。为此，您可以使用 .nextAll() 和 .first() 方法:

$('.selected').removeClass('selected')
              .hide()
              .nextAll('.question')
              .first()
              .show()
              .addClass('selected');

要使用被点击元素的 className 更新前一个 input 兄弟的值，您可以使用 .prev() 和.val() 方法。

$('.selected')...
              .addClass('selected')
              .prev('input')
              .val($(this).hasClass('nu') ? 'no' : 'yes');