2013-01-17 5 views
2

안녕하세요. 텍스트 상자의 유효성을 검사하기 위해이 코드를 가져 와서 값을 포함해야합니다. 그들은 필드가 비어있을 수 없다는 것을 설명하는 메시지를 원합니다.텍스트 상자의 유효성을 검사하여 값을 입력해야합니다.

element.getAttribute('value') 

이됩니다

<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.gotElementById('name').style.color="red"; 
     result = false; 
    } 

     if (document.ExamEntry.subject.value=="") { 
     msg+="You must enter the subject \n"; 
     document.ExamEntry.subject.focus(); 
     document.gotElementById('subject').style.color="red"; 
     result = false; 
    } 

     if (document.ExamEntry.examno.value=="") { 
     msg+="You must enter an examination number \n"; 
     document.ExamEntry.examno.focus(); 
     document.gotElementById('examno').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> 
    <tr> 
     <td id="subject">Subject</td> 
     <td><input type="text" name="subject" /></td> 
    </tr> 
    <tr> 
     <td id="examno">Examination Number</td> 
     <td><input type="integer" name="examno" /></td> 
    </tr> 

<tr> 
    <td><input type="submit" name="Submit" value="Submit" onclick="return validationFrom();" /></td> 
    <td><input type="reset" name="Reset" value="Reset" /></td> 
</tr> 

</table> 
</form> 
</body> 

어떤 도움 당신은 항상 사용해야합니다, 속성 값은 요소와 직접 사용할 수없는 큰 감사

+0

세 번째 끝 부분에 a가 누락되었습니다. 또한 코드 중복이 많습니다. 함수에서 추상화 해보십시오. –

답변

0

것 : 여기에 내가 작성한 코드입니다 value 속성을 가져 오십시오.

희망이 도움이됩니다.

+0

응? 그 결론에 어떻게 도달합니까? – mplungjan

+0

죄송합니다, 저의 잘못 : ( 코드를 잘못 읽으십시오 – SHANK

2
  1. 에서 getElementById 아니라 대신
  2. 양식 이름과 동일한 ID를 사용하지 않는 예약어 이름의
  3. 사용 fullName의를 gotelementById - IE는 버튼의 onclick을 제출 사용하지 않는
  4. 을 혼동됩니다. 대신 양식을
  5. 당신이 가능성이 HTML 파일을 게시 할 수되지 않습니다 onsubmit 사용
  6. HTML5 유형 = "수"없습니다 "정수"를 지원

다음은 각 필드에 속성 value 추가 내 제안한다 - DEMO

나는

function setError(fld,id,msg) { 

    if (fld.value=="") { 
    document.getElementById(id).className="error"; 
    return msg; 
    } 
    document.getElementById(id).className="normal"; 
    return ""; 

} 
window.onload=function() { 
    document.getElementById("ExamEntry").onsubmit=function() { 

    var msg,msgs=[],focusField=""; 
    msg=setError(this.fullName,"fullNameLabel","You must enter your name"); 
    if (msg) { msgs.push(msg); focusField = this.fullName;} 
    msg=setError(this.subject,"subjectLabel","You must enter the subject"); 
    if (msg) { msgs.push(msg); focusField = focusField || this.subject;} 

    var examno = this.examno; 
    msg = setError(examno,"examnoLabel","You must enter an examination number"); 
    if (msg) { msgs.push(msg); focusField = focusField || examno;} 
    else { 
     if (isNaN(examno.value) || examno.value.length<4) { 
     msgs.push("You must enter a valid examination number"); 
     document.getElementById("examnoLabel").className="error" 
     focusField = focusField || this.examno; 
     } 
    } 
    if(focusField) { 
     alert(msgs.join("\n")); 
     focusField.focus(); 
     return false; 
    } 
    return true; // allow submission 
    } 
} 
,691 fullName의

에 라벨 ID와 변경된 이름을 변경 한
+0

환상적인 덕분에 내가 초보자라고 말할 수 있습니다! 지금 어디에서 잘못 읽었는지, 정말로 도움을 주시면 감사하겠습니다. – user1986703

+0

시험을 연장하려면 시험장 번호가 최소 4 자리 이상인지 확인하는 번호 입력란 – user1986703

+0

새 업데이트보기 – mplungjan

1

name과 같이 예약어로 입력 요소의 이름을 지정하면 문제가 발생합니다. 코드 다음 ExamEntry 형태 이미 name라는 속성을 가지고 있기 때문에

document.ExamEntry.name.value 

, 당신에게 문제를 일으킬 것입니다. 입력란의 이름을 바꾸거나 다음 중 하나를 사용해야합니다.

document.ExamEntry.elements['name'].value 
관련 문제