我需要验证单选按钮输入,即当按下提交按钮并且没有选择单选按钮时,它会提醒用户说“请选择选项”,如果选择了单选按钮,则只需提交表单和页面重定向到另一页,不需要警报。 但在我的代码中,每当我按下提交按钮。 即使选择了所有单选按钮,它也会显示“请选择选项”。 请帮忙。
<!DOCTYPE html> <html> <head> <style> label{display:inline-block;width:100px;margin-bottom:10px;} </style> <title>PVQ Questionary</title> <!-- =========================================================== --> <script LANGUAGE="JavaScript"> function validateForm() { var radios = document.getElementsByName("yes no"); var formValid = false; var i = 0; while (!formValid && i < radios.length) { if (radios[i].checked) formValid = true; i++; } if (!formValid) alert("Must check some option!"); return formValid; } </script> <!-- =========================================================== --> </head> <body> <form name="form1" action="process.php" onsubmit="return validateForm()" method="post"> <!-- <form method="post" action="process.php"> --> <label>First Name</label> <input type="text" name="first_name" /> <br /> <label>Last Name</label> <input type="text" name="last_name" /> <br /> <label>Department</label> <input type="text" name="department" /> <br /> <label>Email</label> <input type="text" name="email" /> <br /> <label>Location</label> <input type="text" name="location" /> <br /> <label>Sex</label> <input type="radio" name="sex" value="male" >Male <br/> <div align="center"> <FONT size="" color="blue"> <h1>Portrait Values Questionnaire (PVQ) for Male </h1> <h2> Here we briefly describe some people. Please read each description and think about how much each person is or is not like you. Put an "Yes" or "No" in the given options that shows how much the person in the description is like you.</h2> </div> </FONT> <h3>1. Thinking up new ideas and being creative is important to him. He likes to do things in his own original way.</h3> <input type="radio" name="answer1" value="yes" >Yes <input type="radio" name="answer1" value="no">No <br/> <h3>2. It is important to him to be rich. He wants to have a lot of money and expensive things.</h3> <input type="radio" name="answer2" value="yes" >Yes <input type="radio" name="answer2" value="no">No <br/> <h3>3. He thinks it is important that every person in the world be treated equally. He believes everyone should have equal opportunities in life.</h3> <input type="radio" name="answer3" value="yes" >Yes <input type="radio" name="answer3" value="no">No <br/> <h3>4. It's very important to him to show his abilities. He wants people to admire what he does.</h3> <input type="radio" name="answer4" value="yes" >Yes <input type="radio" name="answer4" value="no">No <br/> <h3>5.It is important to him to live in secure surroundings. He avoids anything that might endanger his safety.</h3> <input type="radio" name="answer5" value="yes" >Yes <input type="radio" name="answer5" value="no">No <br/> <h3>6.He thinks it is important to do lots of different things in life. He always looks for new things to try.</h3> <input type="radio" name="answer6" value="yes" >Yes <input type="radio" name="answer6" value="no">No <br/> <h3>7.He believes that people should do what they're told. He thinks people should follow rules at all times, even when no-one is watching.</h3> <input type="radio" name="answer7" value="yes" >Yes <input type="radio" name="answer7" value="no">No <br/> <h3>8.It is important to him to listen to people who are different from him. Even when he disagrees with them, he still wants to understand them.</h3> <input type="radio" name="answer8" value="yes" >Yes <input type="radio" name="answer8" value="no">No <br/> <h3>9.He thinks it's important not to ask for more than what you have. He believes that people should be satisfied with what they have.</h3> <input type="radio" name="answer9" value="yes" >Yes <input type="radio" name="answer9" value="no">No <br/> <h3>10.He seeks every chance he can to have fun. It is important to him to do things that give him pleasure.</h3> <input type="radio" name="answer10" value="yes" >Yes <input type="radio" name="answer10" value="no">No <br/> <h3>11.It is important to him to make his own decisions about what he does. He likes to be free to plan and to choose his activities for himself.</h3> <input type="radio" name="answer11" value="yes" >Yes <input type="radio" name="answer11" value="no">No <br/> <h3>12.It's very important to him to help the people around him. He wants to care for their well-being.</h3> <input type="radio" name="answer12" value="yes" >Yes <input type="radio" name="answer12" value="no">No <br/> <h3>13.Being very successful is important to him. He likes to impress other people.</h3> <input type="radio" name="answer13" value="yes" >Yes <input type="radio" name="answer13" value="no">No <br/> <h3>14.It is very important to him that his country be safe. He thinks the state must be on watch against threats from within and without.</h3> <input type="radio" name="answer14" value="yes" >Yes <input type="radio" name="answer14" value="no">No <br/> <h3>15.He likes to take risks. He is always looking for adventures.</h3> <input type="radio" name="answer15" value="yes" >Yes <input type="radio" name="answer15" value="no">No <br/> <h3>16.It is important to him always to behave properly. He wants to avoid doing anything people would say is wrong.</h3> <input type="radio" name="answer16" value="yes" >Yes <input type="radio" name="answer16" value="no">No <br/> <h3>17.It is important to him to be in charge and tell others what to do. He wants people to do what he says.</h3> <input type="radio" name="answer17" value="yes" >Yes <input type="radio" name="answer17" value="no">No <br/> <h3>18.It is important to him to be loyal to his friends. He wants to devote himself to people close to him.</h3> <input type="radio" name="answer18" value="yes" >Yes <input type="radio" name="answer18" value="no">No <br/> <h3>19.He strongly believes that people should care for nature. Looking after the environment is important to him.</h3> <input type="radio" name="answer19" value="yes" >Yes <input type="radio" name="answer19" value="no">No <br/> <h3>20.Religious belief is important to him. He tries hard to do what his religion requires.</h3> <input type="radio" name="answer20" value="yes" >Yes <input type="radio" name="answer20" value="no">No <br/> <h3>21.It is important to him that things be organized and clean. He really does not like things to be a mess.</h3> <input type="radio" name="answer21" value="yes" >Yes <input type="radio" name="answer21" value="no">No <br/> <h3>22. He thinks it's important to be interested in things. He likes to be curious and to try to understand all sorts of things.</h3> <input type="radio" name="answer22" value="yes" >Yes <input type="radio" name="answer22" value="no">No <br/> <h3>23. He believes all the worlds’ people should live in harmony. Promoting peace among all groups in the world is important to him.</h3> <input type="radio" name="answer23" value="yes" >Yes <input type="radio" name="answer23" value="no">No <br/> <h3>24.He thinks it is important to be ambitious. He wants to show how capable he is.</h3> <input type="radio" name="answer24" value="yes" >Yes <input type="radio" name="answer24" value="no">No <br/> <h3>25.He thinks it is best to do things in traditional ways. It is important to him to keep up the customs he has learned.</h3> <input type="radio" name="answer25" value="yes" >Yes <input type="radio" name="answer25" value="no">No <br/> <h3>26.Enjoying life's pleasures is important to him. He likes to 'spoil' himself.</h3> <input type="radio" name="answer26" value="yes" >Yes <input type="radio" name="answer26" value="no">No <br/> <h3>27.It is important to him to respond to the needs of others. He tries to support those he knows.</h3> <input type="radio" name="answer27" value="yes" >Yes <input type="radio" name="answer27" value="no">No <br/> <h3>28.He believes he should always show respect to his parents and to older people. It is important to him to be obedient.</h3> <input type="radio" name="answer28" value="yes" >Yes <input type="radio" name="answer28" value="no">No <br/> <h3>29.He wants everyone to be treated justly, even people he doesn't know. It is important to him to protect the weak in society.</h3> <input type="radio" name="answer29" value="yes" >Yes <input type="radio" name="answer29" value="no">No <br/> <h3>30.He likes surprises. It is important to him to have an exciting life.</h3> <input type="radio" name="answer30" value="yes" >Yes <input type="radio" name="answer30" value="no">No <br/> <h3>31.He tries hard to avoid getting sick. Staying healthy is very important to him.</h3> <input type="radio" name="answer31" value="yes" >Yes <input type="radio" name="answer31" value="no">No <br/> <h3>32.Getting ahead in life is important to him. He strives to do better than others.</h3> <input type="radio" name="answer32" value="yes" >Yes <input type="radio" name="answer32" value="no">No <br/> <h3>33.Forgiving people who have hurt him is important to him. He tries to see what is good in them and not to hold a grudge.</h3> <input type="radio" name="answer33" value="yes" >Yes <input type="radio" name="answer33" value="no">No <br/> <h3>34.It is important to him to be independent. He likes to rely on himself.</h3> <input type="radio" name="answer34" value="yes" >Yes <input type="radio" name="answer34" value="no">No <br/> <h3>35.Having a stable government is important to him. He is concerned that the social order be protected.</h3> <input type="radio" name="answer35" value="yes" >Yes <input type="radio" name="answer35" value="no">No <br/> <h3>36.It is important to him to be polite to other people all the time. He tries never to disturb or irritate others.</h3> <input type="radio" name="answer36" value="yes" >Yes <input type="radio" name="answer36" value="no">No <br/> <h3>37.He really wants to enjoy life. Having a good time is very important to him.</h3> <input type="radio" name="answer37" value="yes" >Yes <input type="radio" name="answer37" value="no">No <br/> <h3>38. It is important to him to be humble and modest. He tries not to draw attention to himself.</h3> <input type="radio" name="answer38" value="yes" >Yes <input type="radio" name="answer38" value="no">No <br/> <h3>39. He always wants to be the one who makes the decisions. He likes to be the leader.</h3> <input type="radio" name="answer39" value="yes" >Yes <input type="radio" name="answer39" value="no">No <br/> <h3>40. It is important to him to adapt to nature and to fit into it. He believes that people should not change nature.</h3> <input type="radio" name="answer40" value="yes" >Yes <input type="radio" name="answer40" value="no">No <br/> <input type="submit" value="SUBMIT"> </form> </body> </html>I Need to validate a radio button input, i.e. when submit button is pressed and no radio buttons have been selected, it alerts the user saying 'please select option', and if a radio button has been selected then simply submit the form and pages redirect to another pages, needs no alert. But in my code, whenever I pressed submit button. It shows the 'please select option' even if all the radio button are selected. Please help.
<!DOCTYPE html> <html> <head> <style> label{display:inline-block;width:100px;margin-bottom:10px;} </style> <title>PVQ Questionary</title> <!-- =========================================================== --> <script LANGUAGE="JavaScript"> function validateForm() { var radios = document.getElementsByName("yes no"); var formValid = false; var i = 0; while (!formValid && i < radios.length) { if (radios[i].checked) formValid = true; i++; } if (!formValid) alert("Must check some option!"); return formValid; } </script> <!-- =========================================================== --> </head> <body> <form name="form1" action="process.php" onsubmit="return validateForm()" method="post"> <!-- <form method="post" action="process.php"> --> <label>First Name</label> <input type="text" name="first_name" /> <br /> <label>Last Name</label> <input type="text" name="last_name" /> <br /> <label>Department</label> <input type="text" name="department" /> <br /> <label>Email</label> <input type="text" name="email" /> <br /> <label>Location</label> <input type="text" name="location" /> <br /> <label>Sex</label> <input type="radio" name="sex" value="male" >Male <br/> <div align="center"> <FONT size="" color="blue"> <h1>Portrait Values Questionnaire (PVQ) for Male </h1> <h2> Here we briefly describe some people. Please read each description and think about how much each person is or is not like you. Put an "Yes" or "No" in the given options that shows how much the person in the description is like you.</h2> </div> </FONT> <h3>1. Thinking up new ideas and being creative is important to him. He likes to do things in his own original way.</h3> <input type="radio" name="answer1" value="yes" >Yes <input type="radio" name="answer1" value="no">No <br/> <h3>2. It is important to him to be rich. He wants to have a lot of money and expensive things.</h3> <input type="radio" name="answer2" value="yes" >Yes <input type="radio" name="answer2" value="no">No <br/> <h3>3. He thinks it is important that every person in the world be treated equally. He believes everyone should have equal opportunities in life.</h3> <input type="radio" name="answer3" value="yes" >Yes <input type="radio" name="answer3" value="no">No <br/> <h3>4. It's very important to him to show his abilities. He wants people to admire what he does.</h3> <input type="radio" name="answer4" value="yes" >Yes <input type="radio" name="answer4" value="no">No <br/> <h3>5.It is important to him to live in secure surroundings. He avoids anything that might endanger his safety.</h3> <input type="radio" name="answer5" value="yes" >Yes <input type="radio" name="answer5" value="no">No <br/> <h3>6.He thinks it is important to do lots of different things in life. He always looks for new things to try.</h3> <input type="radio" name="answer6" value="yes" >Yes <input type="radio" name="answer6" value="no">No <br/> <h3>7.He believes that people should do what they're told. He thinks people should follow rules at all times, even when no-one is watching.</h3> <input type="radio" name="answer7" value="yes" >Yes <input type="radio" name="answer7" value="no">No <br/> <h3>8.It is important to him to listen to people who are different from him. Even when he disagrees with them, he still wants to understand them.</h3> <input type="radio" name="answer8" value="yes" >Yes <input type="radio" name="answer8" value="no">No <br/> <h3>9.He thinks it's important not to ask for more than what you have. He believes that people should be satisfied with what they have.</h3> <input type="radio" name="answer9" value="yes" >Yes <input type="radio" name="answer9" value="no">No <br/> <h3>10.He seeks every chance he can to have fun. It is important to him to do things that give him pleasure.</h3> <input type="radio" name="answer10" value="yes" >Yes <input type="radio" name="answer10" value="no">No <br/> <h3>11.It is important to him to make his own decisions about what he does. He likes to be free to plan and to choose his activities for himself.</h3> <input type="radio" name="answer11" value="yes" >Yes <input type="radio" name="answer11" value="no">No <br/> <h3>12.It's very important to him to help the people around him. He wants to care for their well-being.</h3> <input type="radio" name="answer12" value="yes" >Yes <input type="radio" name="answer12" value="no">No <br/> <h3>13.Being very successful is important to him. He likes to impress other people.</h3> <input type="radio" name="answer13" value="yes" >Yes <input type="radio" name="answer13" value="no">No <br/> <h3>14.It is very important to him that his country be safe. He thinks the state must be on watch against threats from within and without.</h3> <input type="radio" name="answer14" value="yes" >Yes <input type="radio" name="answer14" value="no">No <br/> <h3>15.He likes to take risks. He is always looking for adventures.</h3> <input type="radio" name="answer15" value="yes" >Yes <input type="radio" name="answer15" value="no">No <br/> <h3>16.It is important to him always to behave properly. He wants to avoid doing anything people would say is wrong.</h3> <input type="radio" name="answer16" value="yes" >Yes <input type="radio" name="answer16" value="no">No <br/> <h3>17.It is important to him to be in charge and tell others what to do. He wants people to do what he says.</h3> <input type="radio" name="answer17" value="yes" >Yes <input type="radio" name="answer17" value="no">No <br/> <h3>18.It is important to him to be loyal to his friends. He wants to devote himself to people close to him.</h3> <input type="radio" name="answer18" value="yes" >Yes <input type="radio" name="answer18" value="no">No <br/> <h3>19.He strongly believes that people should care for nature. Looking after the environment is important to him.</h3> <input type="radio" name="answer19" value="yes" >Yes <input type="radio" name="answer19" value="no">No <br/> <h3>20.Religious belief is important to him. He tries hard to do what his religion requires.</h3> <input type="radio" name="answer20" value="yes" >Yes <input type="radio" name="answer20" value="no">No <br/> <h3>21.It is important to him that things be organized and clean. He really does not like things to be a mess.</h3> <input type="radio" name="answer21" value="yes" >Yes <input type="radio" name="answer21" value="no">No <br/> <h3>22. He thinks it's important to be interested in things. He likes to be curious and to try to understand all sorts of things.</h3> <input type="radio" name="answer22" value="yes" >Yes <input type="radio" name="answer22" value="no">No <br/> <h3>23. He believes all the worlds’ people should live in harmony. Promoting peace among all groups in the world is important to him.</h3> <input type="radio" name="answer23" value="yes" >Yes <input type="radio" name="answer23" value="no">No <br/> <h3>24.He thinks it is important to be ambitious. He wants to show how capable he is.</h3> <input type="radio" name="answer24" value="yes" >Yes <input type="radio" name="answer24" value="no">No <br/> <h3>25.He thinks it is best to do things in traditional ways. It is important to him to keep up the customs he has learned.</h3> <input type="radio" name="answer25" value="yes" >Yes <input type="radio" name="answer25" value="no">No <br/> <h3>26.Enjoying life's pleasures is important to him. He likes to 'spoil' himself.</h3> <input type="radio" name="answer26" value="yes" >Yes <input type="radio" name="answer26" value="no">No <br/> <h3>27.It is important to him to respond to the needs of others. He tries to support those he knows.</h3> <input type="radio" name="answer27" value="yes" >Yes <input type="radio" name="answer27" value="no">No <br/> <h3>28.He believes he should always show respect to his parents and to older people. It is important to him to be obedient.</h3> <input type="radio" name="answer28" value="yes" >Yes <input type="radio" name="answer28" value="no">No <br/> <h3>29.He wants everyone to be treated justly, even people he doesn't know. It is important to him to protect the weak in society.</h3> <input type="radio" name="answer29" value="yes" >Yes <input type="radio" name="answer29" value="no">No <br/> <h3>30.He likes surprises. It is important to him to have an exciting life.</h3> <input type="radio" name="answer30" value="yes" >Yes <input type="radio" name="answer30" value="no">No <br/> <h3>31.He tries hard to avoid getting sick. Staying healthy is very important to him.</h3> <input type="radio" name="answer31" value="yes" >Yes <input type="radio" name="answer31" value="no">No <br/> <h3>32.Getting ahead in life is important to him. He strives to do better than others.</h3> <input type="radio" name="answer32" value="yes" >Yes <input type="radio" name="answer32" value="no">No <br/> <h3>33.Forgiving people who have hurt him is important to him. He tries to see what is good in them and not to hold a grudge.</h3> <input type="radio" name="answer33" value="yes" >Yes <input type="radio" name="answer33" value="no">No <br/> <h3>34.It is important to him to be independent. He likes to rely on himself.</h3> <input type="radio" name="answer34" value="yes" >Yes <input type="radio" name="answer34" value="no">No <br/> <h3>35.Having a stable government is important to him. He is concerned that the social order be protected.</h3> <input type="radio" name="answer35" value="yes" >Yes <input type="radio" name="answer35" value="no">No <br/> <h3>36.It is important to him to be polite to other people all the time. He tries never to disturb or irritate others.</h3> <input type="radio" name="answer36" value="yes" >Yes <input type="radio" name="answer36" value="no">No <br/> <h3>37.He really wants to enjoy life. Having a good time is very important to him.</h3> <input type="radio" name="answer37" value="yes" >Yes <input type="radio" name="answer37" value="no">No <br/> <h3>38. It is important to him to be humble and modest. He tries not to draw attention to himself.</h3> <input type="radio" name="answer38" value="yes" >Yes <input type="radio" name="answer38" value="no">No <br/> <h3>39. He always wants to be the one who makes the decisions. He likes to be the leader.</h3> <input type="radio" name="answer39" value="yes" >Yes <input type="radio" name="answer39" value="no">No <br/> <h3>40. It is important to him to adapt to nature and to fit into it. He believes that people should not change nature.</h3> <input type="radio" name="answer40" value="yes" >Yes <input type="radio" name="answer40" value="no">No <br/> <input type="submit" value="SUBMIT"> </form> </body> </html>最满意答案
尝试用此替换您的功能。 您还需要添加以下突出显示错过的复选框的CSS样式。 我通常使用jquery并返回一个类数组,但这样你就可以指定问题的数量。 这也为您的用户提供了错过哪个复选框的指示。 还假设您的元素名称格式为“answerxx”
<style> .error { border: 2px solid red; padding:4px; } </style> <script> function validateForm() { var questions = 40 //Set the total number of questions var goodForm = true; //default is form is fine for(var i=1; i <= questions; i++) { //get array of checkboxes for each question by name radio = document.getElementsByName("answer" + i) //check whether there is at least one radio selected if(!(radio[0].checked||radio[1].checked)) { //if not, add the .error class/style radio[0].previousElementSibling.classList.add("error"); goodForm = false; } else { //remove the class if it is ok, need this if user submits again radio[0].previousElementSibling.classList.remove("error"); } } //alert user on error, and return form validation status if(!goodForm) alert("Please check the options highlighted in red") return goodForm; } </script>Try replacing your function with this. You will also need to add the following CSS style that highlights the missed checkbox. I usually use jquery and return a class array, but this way you can specify number of questions. This also gives your user an indication as to which checkbox was missed. Also assumes your element names are in the format "answerxx"
<style> .error { border: 2px solid red; padding:4px; } </style> <script> function validateForm() { var questions = 40 //Set the total number of questions var goodForm = true; //default is form is fine for(var i=1; i <= questions; i++) { //get array of checkboxes for each question by name radio = document.getElementsByName("answer" + i) //check whether there is at least one radio selected if(!(radio[0].checked||radio[1].checked)) { //if not, add the .error class/style radio[0].previousElementSibling.classList.add("error"); goodForm = false; } else { //remove the class if it is ok, need this if user submits again radio[0].previousElementSibling.classList.remove("error"); } } //alert user on error, and return form validation status if(!goodForm) alert("Please check the options highlighted in red") return goodForm; } </script>更多推荐
He,important,电脑培训,计算机培训,IT培训"/> <meta name="description"
发布评论