Based on jQuery to implement whether the check box is selected to answer the question

Based on jQuery to implement whether the check box is selected to answer the question_jquery

WBOY

Release： 2016-05-16 15:26:17

Original

1283 people have browsed it

Recently, the function points encountered in the project requirements are given corresponding prompts according to the options selected by the user. The renderings of the test program are given below to see if you are very satisfied. If you think it is good, please Continue to view the full article.

1. Principle of implementation:

Step one: Determine which item the user selects, that is, which check box is selected

Step 2: Give corresponding prompts based on the check box selection

2. Let’s look at the main program:

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <title></title>
  </head>
  <body>
    <input type="checkbox" id="checkbox01" />A <br />
    <input type="checkbox" id="checkbox02" />B <br />
    <input type="checkbox" id="checkbox03" />C <br />
    <input type="checkbox" id="checkbox04" />D <br />
    <input type="button" id="button" value="提交" />
    <h4 >提示本题是单选题且正确答案是A</h4>
    <script src="js/jquery-1.11.0.js" type="text/javascript" charset="utf-8"></script>
    <script src="js/layout.js" type="text/javascript" charset="utf-8"></script>
  </body>
</html>

Copy after login

It can also be seen from the above that I assume that this question is a multiple choice question and the correct answer is A, then I will start to use JQ to implement it~~~

3. jQuery program

$(function(){
//假设正确答案是A
$("#button").click(function(){
if($("input").filter(":checked").length==0){
alert("请选择一个选项再提交");
}elsif($("#checkbox01").filter(":checked").length!=0&&$("#checkbox02").filter(":checked").length==0&&$("#checkbox03").filter(":checked").length==0&&$("#checkbox04").filter(":checked").length==0){
alert("您选择的答案是正确的！")
}else{
alert("您选择的答案是错误的！")
}
})
}

Copy after login

I have seen a lot of programs on the Internet that determine whether a check box is selected. After testing, most of them are useless. It is probably caused by the jquery version update that eliminates many programs. Who knows, and then I used $("#id ").filter(":checked").length==0 It is possible to determine which option is selected and has been tested~~~ If there are any other methods, please suggest them and let me worship them~~~

The above code is based on jQuery to implement relevant information to prompt whether the check box is selected or not. I hope you like it.