In Javascript, innerhalb der Javascript Event-Handler für onMouseMove wie bekomme ich die Mausposition in x, y corrdinates relativ zum oberen Rand der Seite?onMouseMove bekommen Mausposition
Antwort
wenn Sie jQuery verwenden können, dann wird this helfen:
<div id="divA" style="width:100px;height:100px;clear:both;"></div>
<span></span><span></span>
<script>
$("#divA").mousemove(function(e){
var pageCoords = "(" + e.pageX + ", " + e.pageY + ")";
var clientCoords = "(" + e.clientX + ", " + e.clientY + ")";
$("span:first").text("(e.pageX, e.pageY) - " + pageCoords);
$("span:last").text("(e.clientX, e.clientY) - " + clientCoords);
});
</script>
hier ist reine Javascript einziges Beispiel:
var tempX = 0;
var tempY = 0;
function getMouseXY(e) {
if (IE) { // grab the x-y pos.s if browser is IE
tempX = event.clientX + document.body.scrollLeft;
tempY = event.clientY + document.body.scrollTop;
}
else { // grab the x-y pos.s if browser is NS
tempX = e.pageX;
tempY = e.pageY;
}
if (tempX < 0){tempX = 0;}
if (tempY < 0){tempY = 0;}
document.Show.MouseX.value = tempX;//MouseX is textbox
document.Show.MouseY.value = tempY;//MouseY is textbox
return true;
}
hmm, js Beispiel scheint sehr ähnlich zu http: // www.codelifter.com/main/javascript/capturemoseposition1.html außer ohne die praktischen Kommentare – RozzA
'id =" # divA "' und '$ (" divA ")' - jemand hat geschlafen, als er dies geschrieben hat – RozzA
@RozzA danke für die Aufmerksamkeit. – TheVillageIdiot
Gerade bei mousemove- Ereignissen, das Feuer schnell und wütend, seine gut zerlegen Sie die Handler, bevor Sie sie verwenden -
var whereAt= (function(){
if(window.pageXOffset!= undefined){
return function(ev){
return [ev.clientX+window.pageXOffset,
ev.clientY+window.pageYOffset];
}
}
else return function(){
var ev= window.event,
d= document.documentElement, b= document.body;
return [ev.clientX+d.scrollLeft+ b.scrollLeft,
ev.clientY+d.scrollTop+ b.scrollTop];
}
})()
document.ondblclick = Funktion (e) {Alarm (whereAt (e))};
Es könnte ein bisschen übertrieben sein, d3.js nur zum Auffinden von Mauskoordinaten zu verwenden, aber sie haben eine sehr nützliche Funktion namens d3.mouse(*container*)
. Im Folgenden ist ein Beispiel für das, was Sie tun möchten:
var coordinates = [0,0];
d3.select('html') // Selects the 'html' element
.on('mousemove', function()
{
coordinates = d3.mouse(this); // Gets the mouse coordinates with respect to
// the top of the page (because I selected
// 'html')
});
Im obigen Fall würde die x-Koordinate sein coordinates[0]
, und die y-Koordinate coordinates[1]
wäre. Dies ist äußerst praktisch, da Sie die Mauskoordinaten in Bezug auf einen beliebigen Container abrufen können, indem Sie 'html'
mit dem Tag (z. B. 'body'
), Klassenname (z. B. '.class_name'
) oder ID (z. B. '#element_id'
) austauschen.
+1, aber ** Fair Warning **: Dieser Ansatz ist ein wenig zu träge für den Einsatz gegen 'onmousemove'. Ich hatte bereits d3.js in meinem Projekt, also habe ich es ausprobiert, aber es ist einfach nicht genug für meinen Anwendungsfall. – elrobis
Dies ist erprobt und funktioniert in allen Browsern:
document.onmousemove=function(e) {
var mousecoords = getMousePos(e);
alert(mousecoords.x);alert(mousecoords.y);
};
- 1. onmousemove Event Not Firing
- 2. OnMouseMove wird nicht aufgerufen
- 3. java Mausposition
- 4. onmousemove Ereignis nicht in Chrome arbeitet
- 5. OnMouseDown, OnMouseMove und ein benutzerdefiniertes Steuerelement
- 6. Mausposition während der Mausbewegung abrufen?
- 7. Mausposition in Java
- 8. Mausposition während eines Funktionsaufrufs
- 9. JTable Scrollen durch Mausposition
- 10. Holen DataGrid Zelle von Mausposition
- 11. AppleScript Klicken Sie auf Mausposition
- 12. GLUT Mausposition wird nicht aktualisiert
- 13. SDL Mausposition Nach Größenanpassung abgeschnitten
- 14. Festlegen der Mausposition ohne System.Windows.Forms
- 15. Mausposition funktioniert nicht für FireFox
- 16. Mausposition - Cross-Browser-Kompatibilität - Javascript
- 17. Bild zoom zentriert auf Mausposition
- 18. JScrollPane - Zoom relativ zur Mausposition
- 19. Mausposition ist relatives Fenster, nicht Inhalt
- 20. Was ist der beste Weg, um Mausposition über Form zu bekommen?
- 21. addGlobalMonitorForEventsMatchingMask gibt nur die Mausposition zurück
- 22. Wie die Cursor-Position bekommen
- 23. JavaScript onmousemove zeigen div und folgen der Maus
- 24. So erhalten Sie die Mausposition auf einem Teil von CustomControl
- 25. Mausposition ohne Begrenzung durch Bildschirmgröße, C++ & Windows
- 26. Konvertieren von Mausposition in Weltposition OpenGL
- 27. Jquery UI Draggable: Helfer an Mausposition ausrichten
- 28. Ermitteln der Mausposition beim Ziehen und Ablegen
- 29. "Globale" Mausposition in Mac OS X erhalten
- 30. Mausposition in HTML 5 responsive Canvas
möglich Duplikat von [Wie in jQuery Mausposition zu erhalten, ohne Maus:
Jetzt ist es in einem Fall wie diesem die Sie verwenden können -events?] (http://stackoverflow.com/questions/4517198/how-to-get-mouse-position-in-jquery-without-mouse-events) – Lucio