자바 스크립트 : 양식 객체의 필드에 액세스하는 방법

Question

내 이해에 따르면 this.form은 전체 양식 객체를 보냅니다. 나는이 양식

<form name ="bannerForm" method="post"> 
<table> 
    <tr> 
     <td>Enter banner message</td> 
     <td><input class="messagebannner" type="text" id="bannerMessage" name="bannerMessage" size="40" onblur="validateEmptyFields(this);"></td> 
     <td><span name="messageBanner" id="messageBanner"></span></td> 
    </tr> 

을하고 난 동적 범위 태그의 값을 변경하고 싶은 나는 validateEmptyField() 함수에서 ID를 하드 코딩하지 않고 그것을 할 노력하고 있어요. 이것을 어떻게 할 수 있습니까? 정말 가능하니? 양식 개체가이 점에서 도움이 될 수 있습니까 ??

function validateEmptyFields(inputField){ 
    if(inputField.value.length === 0){ 

//show error message in span 
     return false 
    } 
    else { 
    return true; 
} 
} 

Answer 1

(없이 행할 수도 있지만, 쉽게) 당신은 어떤 jQuery를 마법을 할 수

$(inputField).parent().next().children('span').text(your text here); 

Answer 2

양식이 같은 양식 필드에 액세스 할 수 있습니다 이 validateEmptyField() 함수입니다.

//form acccess 
document.forms["my_form_name"]; 
//fields access 
document.forms["my_form_name"]["input_name"]; 

Answer 3

양식 검증 방법에 약간의 개선이 필요합니다.

this W3Schools page on JavaScript form validation을 확인하십시오. 일단 당신이 그것의 개념을 얻으면 꽤 쉽습니다.

HTML 및 JavaScript는 약간 조정 한 후에 다음과 같이 표시됩니다.

HTML :

<form id="bannerForm" name="bannerForm" method="post"> 
    <table> 
     <tr> 
      <td>Enter banner message</td> 
      <td> 
       <input class="messagebannner" type="text" 
        name="bannerMessage" size="40" onblur="validateBannerForm();" /> 
      </td> 
      <td> 
       <span id="messageBanner"></span> 
      </td> 
     </tr> 
    </table> 
</form> 

자바 스크립트 :

function validateBannerForm() { 
    var x = document.forms["bannerForm"]["bannerMessage"]; 
    if (x.value == null || x.value == "") { 
     document.forms["bannerForm"]["messageBanner"].value = "This is an error message."; 
     return false; 
    } 
} 

개인적으로 전혀 검증이 방법을 좋아하지 않지만, 이해하기 간단하고 목적에 맞게 보인다. JavaScript 및 HTML 양식의 경우 다른 유효성 검사 방법을 연구 할 것입니다.