JavaScript 单选按钮确认

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/14957604/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-26 23:01:10  来源:igfitidea点击:

JavaScript radio button confirmation

javascriptvalidationloopsradio-buttonconfirm

提问by xXRaider

I am trying to add a function, or additional JavaScript to the existing function for a confirmation. I will need a confirmation box once the submit button is clicked saying, "You have chosen (either GCSE, A2 or AS), is this correct?" There should be a cancel button to return to the form or an OK which lets the form be submitted.

我正在尝试向现有函数添加一个函数或其他 JavaScript 以进行确认。单击提交按钮后,我将需要一个确认框,上面写着“您已选择(GCSE、A2 或 AS),这是正确的吗?” 应该有一个取消按钮返回到表单或允许提交表单的确定。

Here is the code, I did a little research and it said use a loop, I am very new to this so I don't know what to do.

这是代码,我做了一些研究,它说使用循环,我对此很陌生,所以我不知道该怎么做。

<head>
<title>Exam entry</title>
<script language="javascript" type="text/javascript">

function validateForm() {
var result = true;
var msg="";
if (document.ExamEntry.name.value=="") {
msg+="You must enter your name \n";
document.ExamEntry.name.focus();
document.getElementById('name').style.color="red";
result = false;
}

if(msg==""){
return result;
}
{
alert(msg)
return result;
}
}

</script>
</head>
<body>
<h1>Exam Entry Form</h1>
<form name="ExamEntry" method="post" action="success.html">
<table width="50%" border="0">
<tr>
<td id="name">Name</td>
<td><input type="text" name="name" /></td>
<tr>
<td id="subject">Subject</td>
<td><input type="text" name="subject" /></td>
</tr>
<tr>
<td id="examnumber">Examination Number</td>
<td><input type="text" name="examnumber" /></td>
</tr>
<tr>
<td><input type="radio" id="examtype" name="examtype" /> : GCSE<br />
<td><input type="radio" id="examtype" name="examtype"  /> : A2<br />
<td><input type="radio" id="examtype" name="examtype" /> : AS<br />
</tr>
<tr>
<td><input type="submit" name="Submit" value="Submit" onclick="return validateForm();"    />  </td>
<td><input type="reset" name="Reset" value="Reset" /></td>
</tr>
</table>
</form>
</body>

回答by Gaurav Pandey

Set your radio buttons' values like this:

像这样设置单选按钮的值:

<td><input type="radio" id="examtype" name="examtype" value="GCSE" /> : GCSE<br />
<td><input type="radio" id="examtype" name="examtype" value="A2" /> : A2<br />
<td><input type="radio" id="examtype" name="examtype" value="AS"/> : AS<br />

Then use this script in your function to validate form or make it a function and call it from your function validateForm:

然后在您的函数中使用此脚本来验证表单或使其成为函数并从您的函数 validateForm 中调用它:

var checked = null;
var inputs = document.getElementsByName('examtype');
for (var i = 0; i < inputs.length; i++) {
          if (inputs[i].checked) {
           checked = inputs[i];
           break;
   }
}
if(checked==null)
{
    alert('Please choose an option');
    return false;
}
else{
    return confirm('You have chosen '+checked.value+' is this correct?');
}

回答by xXRaider

add this to your code#

    function confirmation() {

    for (var i=0; i < document.ExamEntry.examtype.length; i++)
       {
       if (document.ExamEntry.examtype[i].checked)
          {
            var answer = confirm(document.ExamEntry.examtype[i].value)

        if (answer){
            document.ExamEntry.examtype[i].checked = true;

        }
        else{
            document.ExamEntry.examtype[i].checked = false;

        }
          }
    }

    }

Then add to you radio button's

然后添加到您的单选按钮

( value="a2" )
( value="a1" )
( value="G1" )

And also add to your radio button's (onclick="return confirmation();") remember to put this in all of you radio buttons soz if this doesn't work.

并且还添加到您的单选按钮 (onclick="return Confirmation();") 如果这不起作用,请记住将其放入所有单选按钮中。