onclick 함수가 호출되지 않았습니까? - 오류 없음

Question

모든 새 세션에 대해 생성되는 클래스 Session을 정의하고 있습니다.

window.onload에서 Session 객체는 마우스 클릭 이벤트 리스너를 가지고 있으며, 클릭시 핸들러를 실행하고 1. 앵커 태그가 클릭되었는지 확인하고 href를 저장합니다. 2. 마우스 클릭의 x 및 y를 저장합니다.

문제 :user.onclick 함수가 작동하지 않습니다. anchorLinkClickHandler()를 호출하지 않습니다. OR window.addEventListener 즉 x 및 y를 저장하는 click 이벤트 핸들러입니다. 오류 없음. 나는 아래 코드와 구문 문제가 있다고 생각합니다. 아이디어?

(창로드에서) 도시 된 바와 같이

function UserSession(campaignId) { 
    this.campaignId = campaignId; 
    var aTagHref = aTagHref; 

    this.greeting = function() { 
    alert('Hi! I\'m ' + this.name + '.'); 
    }; 

    // get the position of click - Event Listener Function 
    this.getPosition = function(el) { 
       var xPosition = 0; 
       var yPosition = 0; 
       
       while (el) { 
         if (el.nodeName == "BODY") { 
           // deal with browser quirks with body/window/document and page scroll 
           var xScrollPos = el.scrollLeft || document.documentElement.scrollLeft; 
           var yScrollPos = el.scrollTop || document.documentElement.scrollTop; 
       
           xPosition += (el.offsetLeft - xScrollPos + el.clientLeft); 
           yPosition += (el.offsetTop - yScrollPos + el.clientTop); 
         } else { 
           xPosition += (el.offsetLeft - el.scrollLeft + el.clientLeft); 
           yPosition += (el.offsetTop - el.scrollTop + el.clientTop) 
         } 
       
         el = el.offsetParent; 
       } 
       return { 
         x: xPosition, 
         y: yPosition, 
      a: "hahah", 
       }; 
    }; 

    // On click handler 
    this.handleClick = function(event) { 
     // Return the current element clicked on 
     var el = event.currentTarget; 
     // Return the offset values of the element clicked on 
     var relOffsetValues = getPosition(el); 


     // Find the true value of x and y by adding the offset and the to clicked value of x and y 
     var realValueX = (relOffsetValues.x + event.clientX); 
     var realValueY = (relOffsetValues.y + event.clientY); 

     // display the x and y of the mouse click 
     alert("Clicks x:" + realValueX + ", y:" + realValueY); 
     // alert("clientx:" + event.clientX + ", real valie:" + realValueX); 
    } 

    // On click ANCHOR TAGS SAVE THEM 
    // Anchor Tags - Capture the href of the link clicked 
    this.anchorLinkClickHandler = function() { 
     var aTags = document.getElementsByTagName('a'); 

     for (var i = aTags.length - 1; i >= 0; --i) { 
      aTags[i].onclick = function() { 
      aTagHref[i] = this.getAttribute("href"); 
       alert(aTagHref); 
      }; 
     } 
    } 

// END OF CLASS 
} 

창로드 기능 (모두가 호출된다)

: 여기

var user = new UserSession('001'); 

user.onclick = function(event) { 

// check if an anchor tag link is clicked, if so, save the href. 
     user.aTagHref = anchorLinkClickHandler(); 

     // CLICK event listener - save the x and y of mouse click 
     window.addEventListener("load", function(event){  
      document.body.addEventListener("click", handleClick) 
     }); 
} 

전체 코드

window.onload = function() {

var user = new UserSession('001'); 

user.onclick = function(event) { 
    // check if an anchor tag link is clicked, if so, save the href. 
     user.aTagHref = anchorLinkClickHandler(); 

     // CLICK event listener - save the x and y of mouse click 
     window.addEventListener("load", function(event){  
      document.body.addEventListener("click", handleClick) 
     }); 
} 

    // SCROLL Event Listener 
    // Get the x and y of the scroll 
    window.addEventListener("scroll", function(event) { 
     // document.getScroll= function(){ 
      var sx, sy; 
      if(window.pageYOffset!= undefined){ 
       sx = pageXOffset; 
       sy = pageYOffset; 
       console.log(sx +" if " + sy); 
       // return [pageXOffset, pageYOffset]; 
      } 
      else{ 
       var d= document, r= d.documentElement, b= d.body; 
       sx= r.scrollLeft || b.scrollLeft || 0; 
       sy= r.scrollTop || b.scrollTop || 0; 
       console.log(sx +" else " + sy); 
       // return [sx, sy]; 
      } 
     // } 
    }); 
}; 

Answer 1

더 잘 이해하려면 https://developer.mozilla.org/en-US/docs/Web/API/GlobalEventHandlers/onclick을보십시오.

클릭 이벤트는 사용자가 요소를 클릭 할 때 발생합니다. click 이벤트는 mousedown 및 mouseup 이벤트 이후에 발생합니다.

먼저 HTML 요소를 만들어야하며 해당 요소를 클릭하면 원하는 모든 동작을 수행하는 기능을 실행해야합니다.

HTML :

<button id="btn">Click me</button> 

자바 스크립트 : 당신은 설정

document.querySelector("#btn").onclick = function(event) { 
// do things here 
}