onclick函數沒有被調用？ - 無錯誤

Question

我正在定義爲每個新會話創建的類Session。

window.onload，Session對象有一個鼠標點擊事件監聽器，點擊後它觸發處理器，並檢查錨點標記是否被點擊並保存href 2.保存鼠標點擊的x和y。

問題：函數user.onclick不起作用。不調用anchorLinkClickHandler（）; OR window.addEventListener，即保存x和y的click事件處理程序。沒有錯誤。我認爲下面的代碼有一個語法問題..不知道是什麼。想法？

如圖（以在window.onload）：

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) 
     }); 
} 

這裏是全碼：

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 
} 

的window.onload函數（其中一切稱）

（）{

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> 

的JavaScript：

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