我正在尝试制作测验系统,那么如何选择每个动态添加的课程?

时间:2018-11-16 12:59:29

标签: jquery html

实际上是在尝试制作测验系统,所以基本上这是我针对一个问题的html表格

 <form method="POST">

                <div id="questions">
              <div class="form-group">
                <input type="text" class="form-control questionclass" name="question[]" id="question" placeholder="Question 1">
                <cite class="q_error"></cite>
              </div>

              <div class="col-lg-6 col-sm-12">
                <div class="form-group">
                <input type="text" class="form-control option1" name="option_a[]" id="option_a1" placeholder="Option A">
              </div>

              <div class="form-group">
                <input type="text" class="form-control option2" name="option_b[]" id="option_b1" placeholder="Option B">
              </div>

              <div class="form-group">
                <input type="text" class="form-control option3" name="option_c[]" id="option_c1" placeholder="Option C">
              </div>

              <div class="form-group">
                <input type="text" class="form-control option4" name="option_d[]" id="option_d1" placeholder="Option D">
              </div>

              <div class="form-group">
                <input type="text" class="form-control answerclass" name="answer[]" id="answer1" placeholder="Answer">
                <cite id="answer_error"></cite>
              </div>

              </div>
              <hr>

         </div>
          <button class="btn btn-success btn-round mb-4" type="submit" name="submit" id="save" data-toggle="modal" data-target="#shake">Submit</button>
            </form>

所以在我的代码中还有一个添加更多按钮,因此当管理员单击此按钮时,id问题中的整个html会附加在表单下方,以供下一个问题使用 这是我的js代码

<script type="text/javascript">
var x=2;
$("#add_new").click(function(){
  if (x <= 10) {
          $("#questions").append(" <div class='form-group'><input type='text' class='form-control questionclass' name='question[]' id='question' placeholder='Question "+x+"'></div><div class='col-lg-6 col-sm-12'><div class='form-group'><input type='text' class='form-control option1' name='option_a[]' id='option_a1' placeholder='Option A'> </div><div class='form-group'><input type='text' class='form-control option2' name='option_b[]' id='option_b1' placeholder='Option B'></div><div class='form-group'><input type='text' class='form-control option3' name='option_c[]' id='option_c1' placeholder='Option C'></div><div class='form-group'><input type='text' class='form-control option4' name='option_d[]' id='option_d1' placeholder='Option D'></div><div class='form-group'><input type='text' class='form-control answerclass' name='answer[]' id='answer1' placeholder='Answer'></div></div><hr>");
  }
  x++;



})

现在还有另一种方式可以做到这一点??? 和第二个,当用户单击“添加更多”按钮时,则该字段动态添加 因此,当我使用此脚本选择带有“ .questionclass”的所有类时 然后它只选择头等舱,基本上我想在“ .q_error”类中显示一些消息

这是我选择问题类的js代码,此代码仅适用于头等舱

$(".questionclass").each(function(){
  $(this).change(function(){
    $(this).next().html("Some Message")
  })
})

如何选择动态添加的每个班级?

0 个答案:

没有答案