Heim  >  Artikel  >  Web-Frontend  >  js-Methode, um zu bestimmen, ob die Mausposition in einer bestimmten div_javascript-Fähigkeit liegt

js-Methode, um zu bestimmen, ob die Mausposition in einer bestimmten div_javascript-Fähigkeit liegt

PHP中文网
PHP中文网Original
2016-05-16 15:13:223079Durchsuche

Das Beispiel in diesem Artikel beschreibt die Methode von js, um zu bestimmen, ob sich die Mausposition in einem bestimmten p befindet. Teilen Sie es als Referenz mit allen: Wenn das Onmouseout-Ereignis von

p dazu führt, dass p verschwindet, tritt eine Situation auf, in der dies auch der Fall ist, wenn die Maus zu einem anderen Inhalt in p bewegt wird als Verlassen von p beurteilt werden, wird das Onmouseout-Ereignis ausgelöst, sodass der Inhalt in p nicht bearbeitet werden kann. Die Lösung besteht darin, zunächst festzustellen, ob sich die Maus innerhalb von p befindet, wenn das Onmouseout-Ereignis ausgelöst wird. Wenn dies der Fall ist, bedeutet dies, dass die Maus p nicht verlassen hat. Andernfalls wird p gelöscht. OK, jetzt ist das Problem gelöst.
Suchen Sie einfach die Koordinaten der oberen linken Ecke und der unteren rechten Ecke von p und bestimmen Sie, ob sich die Koordinaten der Maus in diesem Bereich befinden.

p.onmouseout=function(event){
    var p = document.getElementById("test");
    var x=event.clientX;
    var y=event.clientY;
    var px1 = p.offsetLeft;
    var py1 = p.offsetTop;
    var px2 = p.offsetLeft + p.offsetWidth;
    var py2 = p.offsetTop + p.offsetHeight;
    if( x < px1 || x > px2 || y < py1 || y > py2){
    //如果离开,则执行。。
}

Im Folgenden sind einige allgemeine Attribute für eine einfache Suche aufgeführt:

clientHeight     获取对象的高度,不计算任何边距、边框、滚动条,但包括该对象的补白。
clientLeft     获取    offsetLeft     属性和客户区域的实际左边之间的距离。
clientTop     获取    offsetTop     属性和客户区域的实际顶端之间的距离。
clientWidth     获取对象的宽度,不计算任何边距、边框、滚动条,但包括该对象的补白。
offsetHeight     获取对象相对于版面或由父坐标    offsetParent     属性指定的父坐标的高度。
offsetLeft     获取对象相对于版面或由    offsetParent     属性指定的父坐标的计算左侧位置。
offsetParent     获取定义对象    offsetTop     和    offsetLeft     属性的容器对象的引用。
offsetTop     获取对象相对于版面或由    offsetTop     属性指定的父坐标的计算顶端位置。
offsetWidth     获取对象相对于版面或由父坐标    offsetParent     属性指定的父坐标的宽度。
offsetX     设置或获取鼠标指针位置相对于触发事件的对象的    x     坐标。
offsetY     设置或获取鼠标指针位置相对于触发事件的对象的    y     坐标。
clientX,clientY   鼠标当前相对于网页的位置,当鼠标位于页面左上角时clientX=0, clientY=0
screenX, screenY是相对于用户显示器的位置
网页可见区域宽: document.body.clientWidth
网页可见区域高: document.body.clientHeight
网页可见区域宽: document.body.offsetWidth    (包括边线的宽)
网页可见区域高: document.body.offsetHeight   (包括边线的宽)
网页正文全文宽: document.body.scrollWidth
网页正文全文高: document.body.scrollHeight
网页被卷去的高: document.body.scrollTop
网页被卷去的左: document.body.scrollLeft
网页正文部分上: window.screenTop
网页正文部分左: window.screenLeft
屏幕分辨率的高: window.screen.height
屏幕分辨率的宽: window.screen.width
屏幕可用工作区高度: window.screen.availHeight
屏幕可用工作区宽度:window.screen.availWidth

Die Oben ist js So ermitteln Sie, ob sich die Mausposition in einem bestimmten div_Javascript-Fähigkeitsinhalt befindet. Weitere verwandte Inhalte finden Sie auf der chinesischen PHP-Website (www.php.cn)!


Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn