Comment puis-je obtenir la position absolue d'un clic de souris à partir d'un événement onClick sur le corps?

J'essaie d'obtenir la position absolue (en haut et à gauche), d'un clic de souris par rapport au navigateur/corps, pas tout parent éléments à l'intérieur du corps.

J'ai un écouteur lié au corps, mais l'e.pageX et de l'e.pageY me donnent la position par rapport à une div.

Remarque que je peux tirer de jQuery et YUI fonctions.

Code qui ne fonctionne pas correctement:

//getting the position
function _handleClick(e) {
    var data = { absX: e.pageX, absY: e.pageY};
    _logClickData(data);
}

//binding the function
var methods = {
    init: function () {
        $("body").click(_handleClick);
    }
};
  • Selon cette (docs.jquery.com/Tutorials:Mouse_Position), ceux-ci devraient vous donner des positions absolues. offsetX/Y vous donne la position relative.
  • vous avez raison, à l'aide de cet exemple, j'ai réalisé que j'avais besoin de lier l'événement dans le document et non le corps du nœud.
  • Ajouté la même réponse!
InformationsquelleAutor Zugwalt | 2011-07-08
  1. 5

    Selon cette (http://docs.jquery.com/Tutorials:Mouse_Position), ceux-ci devraient vous donner des positions absolues. offsetX/Y vous donne la position relative.

    Modifier novembre 2013: l'original de la "Position de la Souris" lien semble brisé, mais la documentation de pageX contient un exemple qui utilise jQuery pageX/Y. Le page sur le offset méthode contient également des exemples pertinents.

    • Le lien que vous avez souligné pour jQuery docs est cassé.
    • L'original docs sont partis (quelqu'un a oublié de mettre en œuvre un 302 page), mais regardez la novembre edition. Ces pages vous donneront la même info.
    • Merci, a vérifier.
    InformationsquelleAutor Mrchief
  2. 8

    L'intervenant est correct. pageX et pageY vous donner la position de la souris par rapport à l'ensemble du document qui n'est pas son parent div. Mais si vous êtes intéressés, vous pouvez obtenir la position par rapport au document à partir de la position par rapport à une div.

    Obtenir la position de la div parent par rapport au corps, puis ajoutez les deux valeurs.

    x = parentdiv.style.left + e.pageX;
y = parentdiv.style.top + e.pageY;



(0,0)
_____________________
|
|
|            __________
|----100----|          |
|           |---60---* |
|           |__________|
|
|
        * = Mouse Pointer

    J'ai fait le schéma parce que c'était amusant. Pas parce que je sentais que cela était nécessaire!!

    Aussi, pour le ci-dessus fonctionne, vous devrez peut-parseInt.

    • +1 pour le plaisir diagramme de! Vous devez présenter cette de jQuery Docs
    InformationsquelleAutor Tyler Biscoe
  3. 2

    Si j'ai bien compris votre question, eh bien, ce serait la solution

     $("body").click(function(e){
   var parentOffset = $(this).offset(); 
   var relX = e.pageX - parentOffset.left;
   var relY = e.pageY - parentOffset.top;

   window.alert(relX);
   window.alert(relY);
});
    • Cela m'a aidé, vous n'ajoutez pas de décalage de vous soustraire, MERCI!
    InformationsquelleAutor Arash Abedin
  4. 0

    La solution, insinuée par @Mrchief du lien de http://docs.jquery.com/Tutorials:Mouse_Position, a été de lier le document et non de l'élément body.

    //binding the function
var methods = {
    init: function () {
        $(document).click(_handleClick);
    }
};
    InformationsquelleAutor Zugwalt