Déterminer si le clic de la souris s'est produit dans la moitié gauche ou droite de DIV

Je me demandais s'il était possible de calculer si un clic de souris était sur la moitié gauche ou droite de l'élément div:

$("div").click(function(e){ // calculate if click happened on left or right half }); <div>Variable Content</div> 

Espérait-il qu'il y ait un moyen d'obtenir les coordonnées relatives et de les relier à la largeur de la div?

  • Pourquoi, lorsque j'envoie un XML à PHP, les nœuds sont en minuscule, mais lorsque je les analyse en PHP, ils sont majuscules?
  • Les débordements de texte multi-lignes de cross-browsers croisés avec des points suspensifs sont-ils ajoutés dans une division fixe de largeur et hauteur?
  • Django chain select
  • Détecter si quelque chose sur la page est animé
  • Utilisation de jQuery UI glisser-déposer: modification de l'élément entraîné lors de la chute
  • Vérifiez si mousedown avec une déclaration if?
  • JQuery document.createElement équivalent?
  • JQuery ajax avance via xhr
  • 6 Solutions collect form web for “Déterminer si le clic de la souris s'est produit dans la moitié gauche ou droite de DIV”

     $("div").click(function(e){ var pWidth = $(this).innerWidth(); //use .outerWidth() if you want borders var pOffset = $(this).offset(); var x = e.pageX - pOffset.left; if(pWidth/2 > x) $(this).text('left'); else $(this).text('right'); }); 

    DEMO: http://jsfiddle.net/dirtyd77/QRKn7/1/

    J'espère que cela t'aides! Faites moi savoir si vous avez des questions!

    Cela devrait le faire:

     $("div").click(function(e){ var $div = $(this); alert(e.pageX >= ($div.offset().left + $div.width()/2) ? 'clicked right' : 'clicked left'); }); 
     var x = evt.pageX - $(this).offset().left if (x > $(this).width()/2) { //Right half } else { //Left half } 

    Donc, le code complet serait

     $("div").click(function(e){ // calculate if click happened on left or right half var x = evt.pageX - $(this).offset().left if (x > $(this).width()/2) { //Right half } else { //Left half } }); 

    Pour obtenir la position de la souris à l'intérieur, vous pouvez calculer la différence entre la position de la souris et le décalage div. Ensuite, comparez-le avec la demi-largeur du div lui-même et voilà.

    MODIFIER

     $(function () { $("#test").click(function(e){ var offset = $(this).offset(); var pos_x = e.pageX - offset.left; var middle = $(this).outerWidth() / 2; if(pos_x < middle) { alert('left part'); } else { alert('right part'); } }); }); 

    Vous pouvez le voir ici:

    http://jsfiddle.net/kZuML/

    Fiddle parce que vous savez – YOLO!

     $("#special").on('click', function(e){ var x = e.pageX - this.offsetLeft; var y = e.pageY - this.offsetTop; //You probably don't need Y. Unless you want to know height as well. var width = $(this).width(), where = width / 2; if( x > where ){ console.log("Click was on the right"); } else { console.log("Click was on the left"); } }); 

    Solution PURE JAVASCRIPT – Rejoindre à la fin de la fête. Mais je l'ai fait avec mon code. Sur l'étiquette du corps ou div lui donner ID et appeler la fonction javascript, par ex. Id = "tt" onclick = "showCoords (événement)"

      function showCoords(event) { var x = event.clientX; var y = event.clientY; // var coor = "X coords: " + x + ", Y coords: " + y; // document.getElementById("demo").innerHTML = coor; var ele = document.getElementById("tt"); var width = ele.offsetWidth; var height = ele.offsetHeight; var half=(width/2); if(x>half) { alert('right click'); } else { alert('left click'); } } 
    JavaScript rend le site Web intelligent, beauté et facile à utiliser.