Ricezione di un evento mousemove (indesiderato) quando si fa clic su un'immagine

Question

Ho una pagina html, in questa pagina ci sono alcune immagini, quando l'utente fa clic su una di queste immagini, un'immagine diversa la sostituisce.

<img style="cursor:hand" src="../_Img/click_me.png" onclick="ChangePic();">

La funzione ChangePic ():

function ChangePic() {
var el = event.srcElement;
el.src = '../_Img/Clicked.png';}

Ho anche un'etichetta sulla pagina che riporta l'azione corrente, ad es. Sposta / Clic destro / Clic sinistro / Doppio clic.

Nel mio onload della pagina html, ho:

onmousemove="ShowAction('Move');" onmousedown="ShowKeysDown('Left','Middle','Right','click');"

Mostra azione cambia semplicemente l'etichetta. ShowKeysDown controlla quale pulsante è stato fatto clic, quindi chiama ShowAction. (Le stringhe di questa chiamata sono per il supporto multilingue)

Il problema che sto riscontrando è che quando un utente fa clic sull'immagine con un solo clic sinistro del mouse, l'immagine cambia correttamente, l'etichetta viene portata in "Clic sinistro" per una frazione di secondo, quindi cambia in "Sposta 'anche se non si è verificato alcun movimento. Ho pensato che potrebbe essere che un singolo clic su un'immagine sia considerato l'inizio di una procedura di trascinamento della selezione, ma non sono sicuro.

Modifica: quando un utente non fa clic su un'immagine e solo in uno spazio bianco casuale, l'etichetta viene visualizzata correttamente come "Clic sinistro" fino a quando non sposta il cursore, quindi cambia in "Sposta". Questo è il comportamento che vorrei fare clic sulle immagini.

Grazie per il tuo tempo.

Nota: questo deve funzionare solo in IE poiché fa parte di un HTMLDialog in mfc.

Answer 1

Presumo che il seguente evento si verifichi per interazione dell'utente:

1. l'utente sposta il mouse sull'immagine - onmousemove - visualizza 'Sposta' sull'etichetta
2. clic dell'utente sull'immagine (clic del pulsante sinistro) - onmousedown - diaplsya "Clic sinistro" sull'etichetta
3. l'utente sposta il mouse fuori dall'immagine - onmousemove - visualizza 'Sposta' sull'etichetta

L'omememove sparerà anche se l'utente sposta il mouse solo di un pixel sull'immagine.

Quindi la soluzione al tuo problema sarebbe:

1. Avere una bandiera globale
2. Impostalo nel gestore eventi di onmousedown
3. Controlla quel flag nel gestore eventi di onmousemove, se non è impostato, visualizza 'Sposta' sull'etichetta e se è impostato, non fare nulla
4. Avere un hanlder di onmouseout, reimpostare la bandiera in questo gestore di eventi, quindi di nuovo ogni volta che viene attivato il fuoco, controllerà la bandiera e poiché non è stato impostato dall'evento click, onmousemove visualizzerà 'Move' sull'etichetta.

Spero che questo sia quello che volevi come comportamento !!!

Answer 2

Correggimi se sbaglio ... ma stai usando l'evento onmousemove . Il comportamento che stai vivendo non è assolutamente normale?

Answer 3

È quasi impossibile fare clic su un oggetto senza ottenere l'evento mousemove ... è necessario filtrarlo in qualche modo, ad esempio se la mossa è troppo piccola, ignorala ...