带有自定义警报的jquery中的多答案测验

对jquery来说有点陌生，我有一个多答案的测试问题。在添加自定义错误消息之前，它一直正常工作

该问题有多个正确答案，对照顶部的变量进行检查。我想让问题也检查他们是否选中了所有复选框或没有复选框。它通过警报消息向用户提供反馈

下面是我的JSFIDLE。。。单击“提交”按钮而不选中任何框，您将看到自定义警报显示两次第二次警报错误。然后注释掉js代码的第一个window.alert行，该行替换了警报框，它将显示一个错误，然后是另一个理想的方式

是否有更好的方法可以构造if语句，同时检查复选框的数量和正确答案

你应该把所有的如果都换成其他的如果。这样，在找到匹配项后，代码就完成了。否则，即使已经满足条件，代码仍将继续运行。这不仅效率更高，而且在这种情况下也是必要的

$('.submit1').click(function(e) {
         e.preventDefault();
        ///checks to see how many checkboxes have been clicked
        var countchecked1 = $("input[name=q1]:checked").length;
          if(countchecked1 == 0) 
            {
           alert("You have not selected any checkboxes.");
            } 
          else if(countchecked1 == 9) 
            {
           alert("Cheating.. You can't select all the boxes.");
           $('input[name=q1]:checked').removeAttr('checked'); 
            return false;
            }

//check correct answers from var above
       else if( $('input[name=q1]:checked').map(function(i,v) { return v.id; }).get().join(',') == rules[0] ) {
            alert("Correct! you selected the correct answers. ");
            return false;
          } 
         else
          {   
            $('input[type="checkbox"].wrong:checked').parent('label').addClass('highlight');     
            $('.wrong:checked').attr('disabled', 'disabled').removeAttr('checked');
            alert("Incorrect... Please try again");
            return false;
         }


     });

还要使用链接，这样Jquery就不必再次搜索DOM树：

$('.wrong:checked').attr('disabled', 'disabled').removeAttr('checked');

如果我是你，我不会允许一次超过5个复选标记

---

JSFIDDLE:

我认为即使是下面的代码也可以做到，因为您已经在所有错误答案中添加了错误的类

   $('.submit1').click(function (e) {
    e.preventDefault();
    ///checks to see how many checkboxes have been clicked
    var $inputq = $("input[name=q1]");
    var $checked = $inputq.filter(":checked");

    if ($checked.length == $inputq.length) {
        alert("Cheating.. You can't select all the boxes.");
        $checked.removeAttr('checked');
        return false;
    }
    var wrongChecked = $('input[type="checkbox"].wrong:checked');
    if (wrongChecked.length > 0) {
        wrongChecked.parent('label').addClass('highlight');
        wrongChecked.attr('disabled', 'disabled');
        wrongChecked.removeAttr('checked');
        alert("Incorrect... Please try again");
        return false;
    } else if ($checked.length == 5) {
        alert("Correct! you selected the correct answers. ");
        return false;
    } else {
        alert("You have not selected All correct checkboxes.");
        return false;
    }
});

---

2警报框的解决方案是ifcountchecked1==0{alertYou尚未选择任何复选框。；return false；}我仍在阅读代码，以找出更好的方法来构造ifAwesome！非常感谢！帮个大忙！我的下一步将是找出如何在本地存储中存储复选框。谢谢Rahul！我将尝试这两种方法。谢谢你的帮助！

   $('.submit1').click(function (e) {
    e.preventDefault();
    ///checks to see how many checkboxes have been clicked
    var $inputq = $("input[name=q1]");
    var $checked = $inputq.filter(":checked");

    if ($checked.length == $inputq.length) {
        alert("Cheating.. You can't select all the boxes.");
        $checked.removeAttr('checked');
        return false;
    }
    var wrongChecked = $('input[type="checkbox"].wrong:checked');
    if (wrongChecked.length > 0) {
        wrongChecked.parent('label').addClass('highlight');
        wrongChecked.attr('disabled', 'disabled');
        wrongChecked.removeAttr('checked');
        alert("Incorrect... Please try again");
        return false;
    } else if ($checked.length == 5) {
        alert("Correct! you selected the correct answers. ");
        return false;
    } else {
        alert("You have not selected All correct checkboxes.");
        return false;
    }
});