檢測元素的客戶區內是否發生了鼠標事件

Question

Javascript中檢測鼠標事件是發生在元素的客戶區內還是外的正確方法是什麼？

我有一個邊框和滾動條充當控制組的容器。我想以編程方式將活動元素集中到組中，當用戶單擊容器客戶區內的任何位置時，而不是單擊該位置時。

Answer 1

我想出瞭如何做到這一點。下面的代碼可能只適用於支持getBoundingClientRect的較新瀏覽器。

function isMouseEventInClientArea(event) 
{ 
    var element = event.currentTarget; 
    var rect = element.getBoundingClientRect(); 
    var minX = rect.left + element.clientLeft; 
    var x = event.clientX; 
    if (x < minX || x >= minX + element.clientWidth) return false; 
    var minY = rect.top + element.clientTop; 
    var y = event.clientY; 
    if (y < minY || y >= minY + element.clientHeight) return false; 
    return true; 
} 

Answer 2

這裏是工作示例 http://jsfiddle.net/kYC9u/ 以下是代碼片段。希望這可以幫助

<button onclick="doSomething('param');" id="id_button">action</button> 
    <button onclick="doSomething('param');" id="id_button1">action2</button> 




function doSomething(param,e) 
     { 
     if (!e) e = window.event; 
     var source1 = e.target || e.srcElement; 
      console.log(source1.id); 
     alert(source1.id); 
     if(window.event) // IE8 and earlier 
      { 
      //doSomething 
      } 
     else if(e.which) // IE9/Firefox/Chrome/Opera/Safari 
      { 
      //doSomething 
      } 

     }