0

我编写了一个表单,可以将信息发布到另一个处理它的页面。我想问用户是否有未选择的选项。我的表格如下所示:

<form action="answers-of-brain-teaser-questions.php" method="post">
<div>
<div>Question 1</div>
<input name="q1" type="radio" value="1">A. 1
<br />
<input name="q1" type="radio" value="2">B. 4
<br />
<input name="q1" type="radio" value="3">C. 3
<br />
<input name="q1" type="radio" value="4">D. 2
</div>
<div>
<div id="question">Question 2</div>
<input name="q2" type="radio" value="5">A. 1
<br />
<input name="q2" type="radio" value="6">B. 2
<br />
<input name="q2" type="radio" value="7">C. 3
<br />
<input name="q2" type="radio" value="8">D. 4
</div>
</form>

如果单击某些单选按钮,如何向用户显示消息。如果问题没有选择答案(没有选择单选按钮),我只想显示一条消息。例如,如果没有为问题 2 选择任何选项。

4

3 回答 3

2

最简单的方法是使用名为required的内置 HTML5 属性,它告诉用户他已经留下了一个字段(在我们的例子中是单选按钮)。
如何使用它的示例:

<!DOCTYPE HTML>
<html>
    <body>
        <form id="exampleForm" action="#" method="get">
            <input name="q1" type="radio" required="required" value="4">test<br />
            <input name="q1" type="radio" required="required" value="4">test<br />
            <input name="q1" type="radio" required="required" value="4">test<br />
            <input name="sform" type="submit">
        </form>
    </body>
</html>
于 2013-03-24T13:25:09.197 回答
1

如果您无法访问 JQuery 并且想要支持不支持的浏览器required,则可以使用以下内容:

var names = new Array("q1", "q2");
var notSelected = new Array();
var checked = "";
for(var i = 0; i < names.length; ++i) {
    var current = getElementsByName(names[i]);
    for(var j = 0; j < current.length; ++j) {
        if(current[j].checked) {
            checked = names[i];
        }
    }
    if(names[i] !== checked)
        notSelected.push(names[i]);
}
if(notSelected.length>0)
    alert("You have to select the following radiogroups: "+notSelected.join(", "));
于 2013-03-24T13:35:09.623 回答
0

如果您想通过 jquery 验证它,它将像- //在脚本中添加 jquery-min.js

function validate(){
  if($("input[name=q2]:checked").length > 0) {
   //Is Valid
  }
}
<form action="answers-of-brain-teaser-questions.php" method="post" onsubmit="validate()">
<div>
<div>Question 1</div>
<input name="q1" type="radio" value="1">A. 1
<br />
<input name="q1" type="radio" value="2">B. 4
<br />
<input name="q1" type="radio" value="3">C. 3
<br />
<input name="q1" type="radio" value="4">D. 2
</div>
<div>
<div id="question">Question 2</div>
<input name="q2" type="radio" value="5">A. 1
<br />
<input name="q2" type="radio" value="6">B. 2
<br />
<input name="q2" type="radio" value="7">C. 3
<br />
<input name="q2" type="radio" value="8">D. 4
</div>
</form>

如果您想在 php 页面中执行此操作,请通过以下方式进行检查-

if(!isset($_POST['q2'})){
//your msg to user
}
于 2013-03-24T13:35:15.410 回答