jquery 코드가 작동하지만 처음이 아닙니다.

Question

jquery를 사용하여 작은 로그인 시스템을 만들려고합니다. (테스트 용이므로 사용자와 비밀번호는 변경되지 않습니다.) 그래서 양식을 만들었고 클릭하면 버튼이 세부 사항이 올바른지 테스트합니다. 그렇다면 다음 페이지로 전송됩니다. 내가 경고하지 않으면.

작동하지만 이상한 점이 있습니다. 처음으로 사이트를 방문하고 세부 정보를 채우면 아무 것도하지 않습니다. 두 번째로 (제출 한 후) 꼭해야하는 것처럼 작동합니다.

누군가가 이유를 알고 있습니까?

function controllogin() { 
    event.preventDefault(); 

    var username = $("#gebruikersnaam").val()  
    var password = $("#wachtwoord").val()  

    if (username=="leerkrachten" && password=="leerkrachten") { 
     alert("welkom leerkrachten"); 
     goToUrl(); 
    } 
    else if (username=="leerling" && password=="leerling") { 
     alert("welkom leerling"); 
    } 
    else { 
     alert("verkeerde gegevens ingevuld"); 
    } 
}; 

function goToUrl() { 
    alert("zoeken naar pagina"); 
    window.location = 'leerkrachten/vakken.html';  
}; 

Answer 1

대신 onclick="controllogin();" 이런 식으로 뭔가를 시도 :

이

$('document').ready(function() { 
    $('#submit').click(function(event) { 
     event.preventDefault(); 

     var username = $("#gebruikersnaam").val()  
     var password = $("#wachtwoord").val()  

     if (username==="leerkrachten" && password==="leerkrachten") { 
      alert("welkom leerkrachten"); 
      goToUrl(); 
     } 
     else if (username==="leerling" && password==="leerling") { 
      alert("welkom leerling"); 
     } 
     else { 
      alert("verkeerde gegevens ingevuld"); 
     } 
    }); 
}); 

또한 문자열을 비교하는 연산자로 === 대신 ==를 사용, 그것은 몇 가지 이상한 못하도록 여기

코드입니다 다른 유형을 비교할 때 결과입니다. 어쩌면 그게 처음으로 작동하지 않는 이유지만, 두 번째 않습니다. 그렇지 않으면 나는 왜 이런 일이 일어나는 지 모른다.

하지만 실제로는 클라이언트 측 로그인 유효성 검사를하지 말고 암호화되지 않은 비밀번호 (서버 측이 아님)로 로그인 확인을하지 마십시오!