Question

我目前有一个拖放界面，允许将答案拖入'destinationBox'，它会将答案标记为正确或不正确。它通过将问题ID与答案类匹配来实现这一点 - 请参阅下面的代码

<div class="question textbox" id="q1">
    1. Assemble the Crisis Management Team
</div>
<div class="destinationBox"></div>

<td>
    <div class="dragDropSmallBox answer a1">0123456789</div>
</td>

// initialisation for all things regarding questions.
function init_questions() {
    questionList = Array();

    $(".question").each(function(index) {
        // find questions and assign answers to them
        var question = new Question(this);
        question.body = this.innerHTML;
        //get id of question
        var id = $(this).attr('id');
        //replace 'q' in ID with 'a' instead
        var number = id.replace(/q/g, 'a');
        var answer = $('.' + number).html();
        question.answers.push(answer);
        questionList.push(question);
    });
}

问题是，每个问题我需要有多个答案。目前，如果我给同一类a1两个答案，它只显示第一个是正确的。根据我的理解，这是因为我的代码正在查看HTML以找到匹配的类，一旦找到它停止并且不继续寻找任何其他匹配的类。我是JavaScript / jQuery的新手，现在还有点不知所措。任何帮助是极大的赞赏！

codepen.io/anon/pen/GpYPRK

Answer 1

不确定这是否有效，正如已经提到的那样，小提琴会有所帮助。尝试更改此行

 var answer = $('.' + number).html();

到此

var answer = $(index).find('.' + number + ':first()').html();

Answer 2

如果我理解正确，那么你的问题'q1'的所有答案都会出现在带有a1类的不同div标签中。那么在这种情况下你能做的就是先找到所有的a1。然后为每个a1找到innerHtml并将其存储在一个数组中。所以你将得到一个数组中的所有答案。

var answers = $('.' + number); 
answers.each(function(){
  var answer = $(this).html();
  //now you can store this answer in an array say "arr"
  arr.push(answer);
  //Rest of your logic
});

我没有测试过这段代码，因此可能存在语法错误，但逻辑应该会给你一些想法。

jQuery拖放测验 - 有多个拖放答案

2 个答案: