解释一下代码的一部分

时间:2014-03-07 09:05:44

标签: javascript html

我需要有人解释当你点击网页底部的“重置”时,下面的代码如何将单选按钮重置为空白

任何帮助都会受到关注,我对javascript和HTML相当陌生

这里有一个小提琴 - http://jsfiddle.net/jamiepollard28/sDLV4/8/

<html>
<head>
<title>Exam entry</title>
<script language="javascript" type="text/javascript">
window.onload=function(){
window.validateForm=function() {
    var result = true;
    var msg = "";
    var focusname="";
    if (document.ExamEntry.name.value == "") {
        msg += "You must enter your name \n";
        focusname="name";
        //document.ExamEntry.name.focus();
        document.getElementById('name1').style.color = "red";
        //result = false;
    }
    if (document.ExamEntry.subject.value == "") {
        msg += "You must enter the subject \n";
       // document.ExamEntry.subject.focus();
        if (focusname=="")
        {
        focusname="subject";
        }
        document.getElementById('subject1').style.color = "red";
        //result = false;
    }
    var Number = document.ExamEntry.Exam_Number.value
    if (Number == "") {
        msg += "You must enter the exam Number \n";
        //document.ExamEntry.Exam_Number.focus();
        if (focusname=="")
        {
        focusname="Exam_Number";
        }
        document.getElementById('Exam_Number1').style.color = "red";
        //result = false;
    }else if (Number.length != 4) {
        msg += "You must enter at least Four Numbers in the Exam Number \n";
         if (focusname=="")
        {
        focusname="Exam_Number";
        }
        //document.ExamEntry.Exam_Number.focus();
        document.getElementById('Exam_Number1').style.color = "red";
        //result = false;
    }
else if (isNaN(Number)) {
        msg += "You must enter at least four numeric characters in the Exam Number feild \n";
     if (focusname=="")
        {
        focusname="Exam_Number";
        }   
    // document.ExamEntry.Exam_Number.focus();
        document.getElementById('Exam_Number1').style.color = "red";
        //result = false;
    }
    var valchecked = '';
    var len = document.getElementsByName('examtype').length;

    for (i = 0; i < len; i++) {

if ( document.ExamEntry.examtype[i].checked ) {

valchecked = document.ExamEntry.examtype[i].value;
 break;

}

}
    if (valchecked == '') {
        msg += "Select Exam Type";
        document.getElementById('Exam_Type').style.color = "red";
         if (focusname=="")
        {
        focusname="examtype_GCSE";
        }

    } 

    if (msg != ""){
        alert(msg)
        document.getElementById(focusname).focus();
        return false;
    }else{
        return confirm('You have chosen ' + valchecked + ' is this correct?');
    }

}
}//]]>  

</script>


</head>
<body>
  <h1>Exam Entry Form</h1>
<form name="ExamEntry" method="post" action="success.html">
<table width="50%" border="0">
<tr>
<td id="name1">Name</td>
<td><input type="text" name="name"  id="name" /></td>
</tr>
<tr>
<td id="subject1">Subject</td>
<td><input type="text" name="subject" id="subject"/></td>
</tr>
<tr>
<td id="Exam_Number1">Exam Number</td>
<td><input type="text" name="Exam_Number" id="Exam_Number" ><font size="3">(Maximum characters: 4)</font> </td>
</tr>
<tr>

<table><form action="">
<td id="Exam_Type">Exam Type</td>
<tr><td><input type="radio" id="examtype_GCSE" name="examtype" value="GCSE" /> : GCSE<br /></tr>
<tr><td><input type="radio" id="examtype_AS" name="examtype" value="AS"/> : AS<br /></tr>
<tr><td><input type="radio" id="examtype_A2" name="examtype" value="A2" /> : A2<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>


</html>

5 个答案:

答案 0 :(得分:3)

<input type="reset" />是HTML表单的内置功能。它只是清除或形成字段并将其他控件设置回默认值。

答案 1 :(得分:0)

您正在使用。这种类型的输入是html中的现成功能,只需单击一下即可使整个表单空白。

http://www.echoecho.com/htmlforms13.htm

答案 2 :(得分:0)

<input type="reset" />只会清除所有输入值

它只是一个重置按钮,是一个内置功能

答案 3 :(得分:0)

重置按钮的属性是将所有值设置为空白,就像您在创建页面时所做的那样。它不包含用户填写表单时填充的值,并且在一个单选按钮,如果您输入任何参数,例如选中/取消选中,则会将其重置为该条件。

     <input type="radio" checked />

并重置将清除所有表单元素,就像提交的内置属性是提交表单并重置设置再次修改。

   <input type="reset"/>

答案 4 :(得分:-1)

Reset对象表示HTML表单中的重置按钮。

单击重置按钮可将表单中的所有控件重置为默认值。

对于HTML表单中的每个标记,都会创建一个Reset对象。

点击重置按钮会触发onreset事件!