Maison > interface Web > js tutoriel > JQuery utilise mousedown et mouseup pour déterminer si les positions d'appui et de relâchement de la souris sont les mêmes

JQuery utilise mousedown et mouseup pour déterminer si les positions d'appui et de relâchement de la souris sont les mêmes

黄舟
Libérer: 2018-05-22 09:31:33
original
2580 Les gens l'ont consulté

Dans JQuery, nous pouvons utiliser mousedown et mouseup pour suivre la pression de la souris et relâcher les événements de la page.

Comment obtenir les informations sur la position de la souris ? Les attributs pageX et pageY de l'événement nous permettent d'obtenir les informations spécifiques de position de la souris sur la page, qui sont équivalentes aux coordonnées xy dans le système de coordonnées mathématiques.

Nous pouvons donc d'abord utiliser une variable globale pour enregistrer les informations de position de la pression de la souris, puis juger de la position enfoncée et relâcher dans la fonction de la souris release Vérifiez si les positions sont cohérentes, puis effectuez des opérations en fonction des résultats.

L'exemple de code est le suivant :

    var x,y;
    $(document).mousedown(function(event){ //获取鼠标按下的位置
        x = event.pageX;
        y = event.pageY;
    });
    $(document).mouseup(function(event){//鼠标释放        
    var newX = event.pageX;        
    var newY = event.pageY;        
    if(x==newX && y==newY){
            //位置相同的操作
        }        else{
            //位置不同的操作
        }
    })
Copier après la connexion

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal