Question

我目前正在进行个性测验，将答案值推送到数组中，稍后我会计算不同的答案值，以确定用户最具/最少的个性特征。

但是，当一个选项的答案值被推入数组时，它是 undefined 。有什么问题？

HTML：

<ul data-quiz-question="1">
    <li class="quiz-answer" data-quiz-answer="2">Blue is my favorite color.</li>
    <li class="quiz-answer" data-quiz-answer="3">Red is my favorite color.</li>
</ul>
<ul data-quiz-question="2">
    <li class="quiz-answer" data-quiz-answer="3">I like apples.</li>
    <li class="quiz-answer" data-quiz-answer="4">I like oranges.</li>
</ul>

JS：

var ansBank = [];

$('ul[data-quiz-question]').each(function(i){
    var $this = $(this),
        chosenAnswer = $this.find('.quiz-answer.active').data('quiz-answer');

    $this.click(function(){
        console.log("Chosen option has been pushed.");
        ansBank.push(chosenAnswer);
    });
});

Answer 1

试试这个：

var ansBank = [];

$('ul[data-quiz-question]').each(function(i) {
  var $this = $(this);

  $this.click(function() {
    var chosenAnswer = $this.find('.quiz-answer').data('quiz-answer');
    console.log("Chosen option '" + chosenAnswer + "' has been pushed.");
    ansBank.push(chosenAnswer);
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul data-quiz-question="1">
  <li class="quiz-answer" data-quiz-answer="2">Blue is my favorite color.</li>
  <li class="quiz-answer" data-quiz-answer="3">Red is my favorite color.</li>
</ul>
<ul data-quiz-question="2">
  <li class="quiz-answer" data-quiz-answer="3">I like apples.</li>
  <li class="quiz-answer" data-quiz-answer="4">I like oranges.</li>
</ul>

Answer 2

更好尝试使用e.target。不需要使用每个函数直接使用$('ul[data-quiz-question]').应用click事件并将目标元素attr推送到数组

var ansBank = [];

$('ul[data-quiz-question]').click(function(e) {
  var chosenAnswer = $(e.target).attr('data-quiz-answer');
  ansBank.push(chosenAnswer);
  console.log(ansBank)
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul data-quiz-question="1">
  <li class="quiz-answer" data-quiz-answer="2">Blue is my favorite color.</li>
  <li class="quiz-answer" data-quiz-answer="3">Red is my favorite color.</li>
</ul>
<ul data-quiz-question="2">
  <li class="quiz-answer" data-quiz-answer="3">I like apples.</li>
  <li class="quiz-answer" data-quiz-answer="4">I like oranges.</li>
</ul>

Answer 3

您的li元素上没有var ansBank = []; $('ul[data-quiz-question]').click(function(){ var $this = $(this), chosenAnswer = $this.find('.quiz-answer').data('quiz-answer'); console.log("Chosen option has been pushed."); ansBank.push(chosenAnswer); //console.log(ansBank); //uncomment if you want to check });个课程。

所以我相信你的代码应该是这样的：

file_get_contents

JsFiddle

Answer 4

＆＃13;

var ansBank = [];

$('ul[data-quiz-question]').click(function(e){
  var target = $(e.target)
  if(target.hasClass('quiz-answer')){
      ansBank.push(target.data('quiz-answer'));
      console.log("Chosen option has been pushed.");
      console.log(ansBank)
  }
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul data-quiz-question="1">
    <li class="quiz-answer" data-quiz-answer="2">Blue is my favorite color.</li>
    <li class="quiz-answer" data-quiz-answer="3">Red is my favorite color.</li>
</ul>
<ul data-quiz-question="2">
    <li class="quiz-answer" data-quiz-answer="3">I like apples.</li>
    <li class="quiz-answer" data-quiz-answer="4">I like oranges.</li>
</ul>

＆＃13;

Answer 5

您必须在ul标签中添加类值

<ul class="data-quiz-question" data-quiz-question="1">

为什么数组中的推送值未定义？

5 个答案: