Development Tip

Javascript의 함수에 이벤트 객체를 전달하는 방법은 무엇입니까?

yourdevel 2020. 12. 13. 11:15
반응형

Javascript의 함수에 이벤트 객체를 전달하는 방법은 무엇입니까?


function check_me() {
  //event.preventDefault();
  var hello = document.myForm.username.value;
  var err = '';

  if(hello == '' || hello == null) {
    err = 'User name required';
  }

  if(err != '') { 
     alert(err); 
     $('username').focus(); 
     return false; 
   } else { 
    return true; }
}

Firefox에서 빈 값을 제출하려고하면 오류가 발생하고 포커스가 다시 요소로 설정됩니다. 그러나 IE에서는 오류가 발생하고 확인을 클릭 한 후 양식을 게시 (true 반환)하므로 동일한 일이 발생하지 않습니다.

이것을 어떻게 피할 수 있습니까? event.preventDefault ()를 사용하여 이것을 피하려고 생각했지만이 방법을 사용하여 이것을 수행하는 방법을 모르겠습니다. checkme (event) .. 통과를 시도했지만 작동하지 않았습니다. Prototype js를 사용하고 있습니다.

(Jquery를 사용하여 html .. 내에서 onclick을 호출하는 대신 javascript ..에서 .click 함수를 바인딩 할 때 이벤트를 전달하는 방법을 알고 있지만이 코드를 디버깅해야합니다)


onclick js가 'return'을 사용하여 원하는 반환 값이 사용되는지 확인하십시오.

<button type="button" value="click me" onclick="return check_me();" />

  1. check_me 함수의 정의를 다음과 같이 수정하십시오.

    function check_me(ev) {
    
  2. 이제 귀하의 경우 이벤트의 메소드 및 매개 변수에 액세스 할 수 있습니다.

    ev.preventDefault();
    
  3. 그런 다음 인라인 호출에서 onclick에 매개 변수를 전달해야합니다.

    <button type="button" onclick="check_me(event);">Click Me!</button>
    

이를 이해 하는 데 유용한 링크 입니다.


전체 예 :

<!DOCTYPE html>
<html lang="en">
  <head>
    <script type="text/javascript">
      function check_me(ev) {
        ev.preventDefault();
        alert("Hello World!")
      }
    </script>
  </head>
  <body>
    <button type="button" onclick="check_me(event);">Click Me!</button>
  </body>
</html>

바인딩을 다음과 같이 변경합니다.

<button type="button" value="click me" onclick="check_me" />

그런 다음 check_me()함수 선언을 다음과 같이 변경합니다 .

function check_me() {   
  //event.preventDefault();
  var hello = document.myForm.username.value;
  var err = '';

  if(hello == '' || hello == null) {
    err = 'User name required';
  }

  if(err != '') { 
     alert(err); 
     $('username').focus(); 
     event.preventDefault(); 
   } else { 
    return true; }
}

참고 URL : https://stackoverflow.com/questions/1276870/how-to-pass-an-event-object-to-a-function-in-javascript

반응형