Mostra la posizione x e y del mouse con javascript

Question

La prima versione non mi mostra x e y e ottengo il seguente errore: Uncaught TypeError: Cannot read property 'pageX' of undefined La seconda versione funziona ma è codificata molto simile, non riesce a trovare il problema.

PRIMA VERSIONE (non funzionante)

<form name ="show"> 
     <input type="text" name="mouseXField" value="0" size="6">Mouse X Position<br> 
     <input type="text" name="mouseYField" value="0" size="6">Mouse Y Position<br> 
    </form> 

     <script type="text/javascript"> 

     var mie = (navigator.appName == "Microsoft Internet Explorer") ? true : false; 

     if (!mie) { 

      document.captureEvents(Event.MOUSEMOVE); 
      document.captureEvents(Event.MOUSEDOWN); 
     } 


     document.onmousemove = mousePos(); 
     document.onmousedown = mouseClicked(); 

     var mouseClick; 
     var keyClicked; 

     var mouseX = 0; 
     var mouseY = 0; 

     function mousePos (e) { 

      if (!mie) { 
       mouseX = e.pageX; 
       mouseY = e.pageY; 
      } 
      else 
       mouseX = event.clientX + document.body.scrollLeft; 
       mouseY = event.clientX + document.body.scrollTop; 


     document.show.mouseXField.value = mouseX; 
     document.show.mouseYField.value = mouseY; 

     return true; 
     } 

     </script> 

seconda versione (LAVORO)

 <form name="Show"> 
      <input type="text" name="MouseX" value="0" size="4"> X<br> 
      <input type="text" name="MouseY" value="0" size="4"> Y<br> 
     </form> 


     <script type="text/javascript"> 

      var IE = document.all?true:false 


      if (!IE) document.captureEvents(Event.MOUSEMOVE) 


      document.onmousemove = getMouseXY; 


      var tempX = 0 
      var tempY = 0 



      function getMouseXY(e) { 
       if (IE) { 

       tempX = event.clientX + document.body.scrollLeft 
       tempY = event.clientY + document.body.scrollTop 
       } 
       else 
       { 
       tempX = e.pageX 
       tempY = e.pageY 
       } 


       document.Show.MouseX.value = tempX 
       document.Show.MouseY.value = tempY 

       return true 
       } 
     </script>  

Answer 1

In una prima vista: clientX dovrebbe essere clientY e dispersi {} nel else:

else { 
    mouseX = event.clientX + document.body.scrollLeft; 
    mouseY = event.clientY + document.body.scrollTop; 
} 

Anche tu necessità di inviare l'evento alla funzione,

document.onmousemove = function (e) {mousePos(e);}; 
... 
function mousePos (e) { 
... 

controllo questo fuori: http://jsfiddle.net/NLsdZ/1/

Inoltre, l'uso di captureEvents è deprecato, è necessario utilizzare addEventListener invece. Maggiori informazioni qui: http://forums.asp.net/t/1576872.aspx

Answer 2

Avevo anche notato che non stai scaricando sotto, o almeno affermando che lo sei.

var mie = (navigator.appName == "Microsoft Internet Explorer") ? true : false; 

    if (!mie) { 

     document.captureEvents(Event.MOUSEMOVE); 
     document.captureEvents(Event.MOUSEDOWN); 
    } 


    document.onmousemove = mousePos(); 
    document.onmousedown = mouseClicked(); 

dovrebbe essere come/o, infine, ha lavorato per me, come:

window.onload = function() { 
     mie = (navigator.appName == "Microsoft Internet Explorer") ? true : false; 


    if (!mie) { 
     document.captureEvents(Event.MOUSEMOVE); 
     document.captureEvents(Event.MOUSEDOWN); 
    } 
     document.onmousemove = function (e) {mousePos(e);}; 
     document.onmousedown = function (e) {mouseClicked();}; 
};