JavaScript 알림/오류 확인

Question

현재 새 사용자가 내 웹 사이트에 등록 할 때 양식을 작성해야합니다. 암호가 너무 짧거나 일치하지 않으면 필드의 일부를 채우지 않거나 다른 오류가 발생했습니다. 경고를 보내려고합니다. 현재 경고를하지 않으므로 확인을 위해 전환했습니다. 그 중 하나가 작동하지 않았다 그래서 나는 showModalDiaglog 사용을 고려. 그것도 작동하지 않았다, 나는 아이디어에서 벗어났다.

HTML

<form> 
    First Name:<br/> <input id="firstname"/><br/> 
    Last Name: <br/> <input id="lastname"/><br/> 
    Age:  <br/> <input id="age"/><br/> 
    Your Email:<br/> <input id="email"/><br/> 
    Username: <br/> <input id="username"/><br/> 
    Password: <br/> <input id="password"/><br/> 
    Confirm Password:<br/> <input type="password" id="passwordconfirm"/><br/> 
    <br/> 
    <button size=20 onClick='getRegistrationFields()'>Submit</button> 
    </form>​ 

자바 스크립트 오타가

function getRegistrationFields() { 
var first = document.getElementById("firstname").value; 
var last = document.getElementById("lastname").value; 
var email = document.getElementById("email").value; 
var age = document.getElementById("age").value; 
var username = document.getElementById("username").value; 
var password = document.getElemetnById("password").value; 
var confirm = document.getElementById("passwordconfirm").value; 
var empty = ""; 

if ((first === empty) || (last === empty) || (email === empty) || (age === empty) 
    || (username === empty) || (password === empty) || (confirm === empty)) { 
    var message = "Not all of the fields are filled out"; 
    prompt(message); 
    //showModalWindow("fields"); 
    return false; 
    } 

else { 
    age = parseInt(age); 

    if (password.length < 10) { 
     var message2 = "Password must be at least 10 characters long"; 
     prompt(message2); 
     //showModalWindow("passwordlength"); 
     return false; 
     } 

    else if (password != confirm) { 
     var message3 = "Passwords Do not match"; 
     prompt(message3); 
     //showModalWindow("passwordmatch"); 
     return false; 
     } 

    else if (age < 18) { 
     var message4 = "You must be older to register for this software."; 
     prompt(message4); 
     //showModalWindow("young"); 
     return false; 
     } 

    else { 
     var message5 = "All of the fields are correct. We will be processing your request"; 
     prompt(message5); 
     //showModalWindow("success"); 
     return true; 
     } 
    } 
} 

function showModalWindow(fileName) { 
    window.showModalDialog("alerts/" + url + ".html", "", "resizable: no; height: 150; width: 350;"); 
} 

Answer 1

는

HTML을 시도합니다.

<input type="password" class="password" /> 
    <input type="text" class="age" /> 
    <script type="text/javascript"> 
     !(function() { 
      var txBxs = document.querySelectorAll('input[type=textbox]'), 
       i = txBxs.length; 
      while (i--) { 
       tkBxs[i].onchange = textBoxCheck; 
      }; 
     }()); 
     // 
     function textBoxCheck() { 
      // 
      switch (this.class) { 
       // 
       case 'password': 
        if (this.value.length < 10) 
        { alert('Password to short'); }; 
        break; 
        // 

       case 'age': 
        if (+this.value < 18) 
        { alert('To young kiddo!'); }; 
        break; 
      }; 
     }; 
    </script> 

Answer 2

가 :

var password = document.getElemetnById("password").value; 

당신은 getElemetnById 대신 getElementById 쓴 나는 현재이 있습니다.

<button size="20" id="btn_submit">Submit</button> 

JS :

var btn_submit = document.getElementById("btn_submit"); 
btn_submit.onclick = getRegistrationFields; 

Answer 3

자신에 쉽게 확인