我正在尝试编写一个函数,在警告框中显示用户的输入级别

时间:2014-02-12 14:28:34

标签: javascript html radio-button

我目前正在尝试编写一个功能,在警告框中显示用户的输入级别,以便可以确认或拒绝级别,我完全陷入困境,任何帮助都会非常感激,我可能会如果有这样的话你能告诉我如何解决这个问题吗?我试图在我这样做的时候出现一个警告框,但是当我尝试其他验证时不起作用。

<html>
<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 (document.ExamEntry.subject.value == "") {
        msg += "You must enter the subject \n";
        document.ExamEntry.subject.focus();
        document.getElementById('subject').style.color = "red";
        result = false;
    }
    if (document.ExamEntry.Exam_Number.value == "") {
        msg += "You must enter the exam Number \n";
        document.ExamEntry.subject.focus();
        document.getElementById('Exam_Number').style.color = "red";
        result = false;
    }
    if (document.ExamEntry.Exam_Number.value.length != 4) {
        msg += "You must enter at least Four Numbers in the Exam Number \n";
        document.ExamEntry.Exam_Number.focus();
        document.getElementById('Exam_Number').style.color = "red";
        result = false;
    }
    var Number = document.ExamEntry.Exam_Number.value
    if (isNaN(document.ExamEntry.Exam_Number.value)) {
        msg += "You must enter at least four numeric characters in the Exam Number feild \n";
        document.ExamEntry.Exam_Number.focus();
        document.getElementById('Exam_Number').style.color = "red";
        result = false;
    }
    var checked = null;
    var inputs = document.getElementsByName('Exam_Type');
    for (var i = 0; i < inputs.length; i++) {
        if (inputs[i].checked) {
            checked = inputs[i];
            break;
        }
    }
    if (checked == null) {
        msg += "Anything for now /n";
        return false;
    } else {
        return confirm('You have chosen ' + checked.value + ' is this correct?');
    }
    if (msg == "") {
        return result;
    } {
        alert(msg)
        return result;
    }
}
</script>
</head>

以下是我的HTML代码

<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>
<tr>
<td id="subject">Subject</td>
<td><input type="text" name="subject" /></td>
</tr>
<tr>
<td id="Exam_Number">Exam Number</td>
<td><input type="text" name="Exam_Number"<font size="1">(Maximum characters: 4)</font> </td>
</tr>
<tr>

<table><form action="">

<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 />
<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>
</html>

1 个答案:

答案 0 :(得分:0)

我希望这对你有用

JSFiddle

window.validateForm=function() {
    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 (document.ExamEntry.subject.value == "") {
        msg += "You must enter the subject \n";
        document.ExamEntry.subject.focus();
        document.getElementById('subject').style.color = "red";
        //result = false;
    }
    if (document.ExamEntry.Exam_Number.value == "") {
        msg += "You must enter the exam Number \n";
        document.ExamEntry.subject.focus();
        document.getElementById('Exam_Number').style.color = "red";
        //result = false;
    }
    if (document.ExamEntry.Exam_Number.value.length != 4) {
        msg += "You must enter at least Four Numbers in the Exam Number \n";
        document.ExamEntry.Exam_Number.focus();
        document.getElementById('Exam_Number').style.color = "red";
        //result = false;
    }
    var Number = document.ExamEntry.Exam_Number.value
    if (isNaN(document.ExamEntry.Exam_Number.value)) {
        msg += "You must enter at least four numeric characters in the Exam Number feild \n";
        document.ExamEntry.Exam_Number.focus();
        document.getElementById('Exam_Number').style.color = "red";
        //result = false;
    }
    var checked = null;
    var inputs = document.getElementsByName('Exam_Type');
    for (var i = 0; i < inputs.length; i++) {
        if (!checked) {
            checked = inputs[i];
        }
    }
    if (checked == null) {
        msg += "Anything for now /n";

    } else {
        return confirm('You have chosen ' + checked.value + ' is this correct?');
    }
    if (msg == "") {
        return result;
    } {
        alert(msg)
        return false;
    }
}