Javascript 使用jquery进行正确或错误验证

我正在尝试制作一个正确或错误的游戏，需要帮助编写函数来验证用户是否正确。我的DOM结构如下：

<ul class="multiplechoice_answergroup">
  <li class="multiplechoice_answer True">
    <input class="checkbox" type="checkbox" name="checkme">
    <p>This answer is true</p>
  </li>

  <li class="multiplechoice_answer False">
    <input class="checkbox" type="checkbox" name="checkme">
    <p>This answer is false</p>
  </li>
</ul>

而不是做

$('.multiplechoice_answergroup').children('li')
   .find('input[type="checkbox"]:checked')

你应该这样做

$('.multiplechoice_answergroup').children('li')
   .find('input[type="checkbox"]').is(":checked")

原因:

find返回一个jQuery对象，该对象在JavaScript中验证为true。因此，第一个或第二个if表达式将始终为true，紧跟&&的部分始终为true

当然这里也有：

$('.multiplechoice_answergroup').children('li').find('input[type="checkbox"]').is(":not(:checked)")

那么：

truefalseSubmit = function() {
    $('.multiplechoice_answer input[type="checkbox"]').click(function() {
        /**
         * Check if the parent div where checkbox is, has the class "true"
         */

            if($(this).parent().hasClass('true'))
                return correctAnswer();

        /**
         * Answer is incorrect
         */

            return incorrectAnswer();
    });
}

---

我认为应该是这样的：

truefalseSubmit = function() {
  var $trueCheckbox = $('.multiplechoice_answergroup li.True input[type="checkbox"]');
  var $falseCheckbox = $('.multiplechoice_answergroup li.False input[type="checkbox"]');
  if ($trueCheckbox.is(':checked') && $falseCheckbox.is(':not(:checked)')) {
    correctAnswer();
  } else {
    incorrectAnswer();
  }
};

为什么不这样呢

html:

---

您还可以继续查找并检查集合的长度。$'。multipleEchoice\u answergroup li input[type=checkbox]：checked。如果存在任何选中的项，长度>0将返回true，否则返回false。@ps2goat您可以，但我个人认为is更合适。我一直认为这是一个正确的答案，无论我做什么。您所说的“如果用户是对的还是错的”是什么意思？你为什么用复选框来代替单选按钮来选择是/否？这也是我的问题。是另一种选择，不使用li元素本身

truefalseSubmit = function() {
  var $trueCheckbox = $('.multiplechoice_answergroup li.True input[type="checkbox"]');
  var $falseCheckbox = $('.multiplechoice_answergroup li.False input[type="checkbox"]');
  if ($trueCheckbox.is(':checked') && $falseCheckbox.is(':not(:checked)')) {
    correctAnswer();
  } else {
    incorrectAnswer();
  }
};

<ul>
  <li class="answer-button true">
    <p>This answer is true</p>
  </li>

  <li class="answer-button false">
    <p>This answer is false</p>
  </li>
</ul>

var answerHandler = function (answer) {
    // do something
};
$('.answer-button').click(function () {
    answerHandler($(this).hasClass('true'));
});