Maison > interface Web > js tutoriel > jQuery : événements de conflit avec la souris et le clic

jQuery : événements de conflit avec la souris et le clic

黄舟
Libérer: 2017-06-28 09:23:21
original
2958 Les gens l'ont consulté

MouseÉvénement, utilise généralement le bouton pour distinguer les boutons de la souris (la norme DOM3 stipule : l'événement de clic ne peut surveiller que le bouton gauche, et les boutons de la souris ne peuvent être jugés que via mousedown et mouseup) :

1. Bouton gauche de la souris = 0

2. Bouton droit de la souris = 2

3. Bouton de la molette de la souris = 1

p.onmousedown = function (e) {
    var event = e || window.event;
    if(event.button == 2){
        console.log('right');
    }else if(event.button == 0){
        console.log('left');
    }
}
Copier après la connexion

Solution pour appuyer sur la souris et cliquer sur Conflit. entre les événements (utilisez l'heure d'apparition de l'événement pour déterminer si la durée de l'événement de clic est courte)

<span style="color: #000000">var key = false;//设置了一个标志 false为点击事件 ture为鼠标移动事件
var firstTime = 0;
var lastTime = 0;
p.<a href="http://www.php.cn/wiki/1449.html" target="_blank">onclick</a> = function() {
    if(key){
        console.log(&#39;click&#39;);
        key = false;
    }
}
p.onmousedown = function() {
    firstTime = new Date().getTime();
    console.log(&#39;mouseDown&#39;);
}
p.<a href="http://www.php.cn/wiki/1459.html" target="_blank">onmouseup</a> = function() {
    console.log(&#39;mouseUp&#39;);<br/>//鼠标抬起后 记录时间 超过200ms就是移动事件
    lastTime = new Date().getTime();
    if( (lastTime - firstTime) </span><span style="color: #0000ff"><</span><span style="color: #800000"> 200</span><span style="color: #ff0000">){
        key </span><span style="color: #0000ff">= true;    </span><span style="color: #ff0000">}
}</span>
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