Controlla se l'evento è attivato da un essere umano


140

Ho un gestore collegato a un evento e vorrei che fosse eseguito solo se è attivato da un metodo umano e non da un metodo trigger (). Come posso dire la differenza?

Per esempio,

$('.checkbox').change(function(e){
  if (e.isHuman())
  {
    alert ('human');
  }
});

$('.checkbox').trigger('change'); //doesn't alert

Risposte:


212

Puoi controllare e.originalEvent: se è definito il clic è umano:

Guarda il violino http://jsfiddle.net/Uf8Wv/

$('.checkbox').change(function(e){
  if (e.originalEvent !== undefined)
  {
    alert ('human');
  }
});

il mio esempio nel violino:

<input type='checkbox' id='try' >try
<button id='click'>Click</button>

$("#try").click(function(event) {
    if (event.originalEvent === undefined) {
        alert('not human')
    } else {
        alert(' human');
    }


});

$('#click').click(function(event) {
    $("#try").click();
});

1
@Nicola Questo è documentato ovunque?
Šime Vidas,

@Sime non lo so, ma penso che sia standard. guarda qui: api.jquery.com/category/events/event-object
Nicola Peluchetti

@Nicola Capisco, è una cosa jQuery. jQuery memorizza l'oggetto evento originale all'interno di questa proprietà. A proposito, cosa vuoi dire con non lo sai? Hai appena fornito il link alla documentazione:)
Šime Vidas,

1
Sembra che tu possa anche usareevent.isTrigger
avoliva

1
@Anurag, stavo riscontrando lo stesso problema proprio ora. Sembra che jQuery si popoli originalEventquando l'evento viene attivato DOM.click(), ma puoi usarlo $($("#try")[0]).click();, che è grosso, ma funziona.
Daniel Garrett,

19

Più semplice di quanto sopra sarebbe:

$('.checkbox').change(function(e){
  if (e.isTrigger)
  {
    alert ('not a human');
  }
});

$('.checkbox').trigger('change'); //doesn't alert

Questa è la risposta migliore Per una spiegazione, vedi: stackoverflow.com/questions/10704168/...
jaredjacobs

3
Mentre questo è allettante e probabilmente comodo nella pratica, si noti che gli sviluppatori jQuery non desiderano passareisTrigger all'API pubblica a partire da questo momento .
Jon,

7

Penso che l'unico modo per farlo sarebbe passare un parametro aggiuntivo sulla triggerchiamata secondo la documentazione .

$('.checkbox').change(function(e, isTriggered){
  if (!isTriggered)
  {
    alert ('human');
  }
});

$('.checkbox').trigger('change', [true]); //doesn't alert

Esempio: http://jsfiddle.net/wG2KY/


1
puoi verificare la proprietà originalEvent dell'oggetto evento: se l'evento non proviene da un clic, è indefinito
Nicola Peluchetti


1
Per qualche motivo, event.originalEvent non funzionava per me (continuava a ritirare 1) quando utilizzavo il gestore 'click' di Zepto. Quindi ho provato la soluzione sopra. Ha funzionato come un fascino.
Larrydx,

7

La risposta accettata non ha funzionato per me. Sono passati 6 anni e da allora jQuery è cambiata molto.

Ad esempio, event.originalEventritorna sempretrue con jQuery 1.9.x. Voglio dire, l'oggetto esiste sempre, ma il contenuto è diverso.

Coloro che usano le versioni più recenti di jQuery possono provare questo. Funziona su Chrome, Edge, IE, Opera, FF

if ((event.originalEvent.isTrusted === true && event.originalEvent.isPrimary === undefined) || event.originalEvent.isPrimary === true) {
    //Hey hooman it is you
}

3

Attualmente la maggior parte dei browser supporta event.isTrusted :

if (e.isTrusted) {
  /* The event is trusted: event was generated by a user action */
} else {
  /* The event is not trusted */
}

Da documenti :

L'IsTrusted sola lettura di proprietà della Eventinterfaccia è una Boolean che è vero quando l'evento è stato generato da un'azione dell'utente, e falsa quando l'evento è stato creato o modificato da uno script o spedito tramite EventTarget.dispatchEvent () .


0

È possibile utilizzare onmousedown per rilevare il clic del mouse rispetto alla chiamata trigger ().


Potrei non lavorare sul seguente scenario: A volte è possibile selezionare gli elementi della pagina usando il tasto Tab. Ad esempio, se ho selezionato in questo modo una casella di controllo, posso selezionare / deselezionare utilizzando il tasto spazio. O anche aprire un drodpdown usando il tasto freccia giù.
Diego Favero,

0

Vorrei pensare a una possibilità in cui si controlla la posizione del mouse, come:

  • Clic
  • Ottieni la posizione del mouse
  • Si sovrappone alle corde del pulsante
  • ...

Potrei non lavorare sul seguente scenario: A volte è possibile selezionare gli elementi della pagina usando il tasto Tab. Ad esempio, se ho selezionato in questo modo una casella di controllo, posso selezionare / deselezionare utilizzando il tasto spazio. O anche aprire un drodpdown usando il tasto freccia giù.
Diego Favero,

0

Nel caso in cui tu abbia il controllo di tutto il tuo codice, nessuna chiamata aliena $(input).focus()di setFocus().

Utilizzare una variabile globale è un modo corretto per me.

var globalIsHuman = true;

$('input').on('focus', function (){
    if(globalIsHuman){
        console.log('hello human, come and give me a hug');
    }else{
        console.log('alien, get away, i hate you..');
    }
    globalIsHuman = true;
});

// alien set focus
function setFocus(){
    globalIsHuman = false;
    $('input').focus();
}
// human use mouse, finger, foot... whatever to touch the input

Se qualche alieno vuole ancora chiamare $(input).focus()da un altro pianeta. Buona fortuna o controlla altre risposte


Questo impedisce solo alle persone di chiamare setFocus()- non impedisce alle persone di attivare l'evento focus. Non scrivere setFocus()affatto impedirebbe anche alle persone di chiamarlo, quindi non vedo il vantaggio. In effetti, le persone potrebbero ancora chiamare $('input').focus()e far passare.
Rob

wow, la prima volta che ho qualcuno commento subito dopo aver risposto alla domanda, aggiornerò la risposta
vanduc1102

Se lavori in un ambiente chiuso senza script di terze parti, funzionerebbe in un mondo perfetto. Tuttavia, la maggior parte delle applicazioni pratiche sono per i siti client a cui sono aggiunti tutti i tipi di plugin e script che benissimo potrebbero chiamare quel focus. Una cosa che potrebbe aiutare questo è di racchiudere il tuo codice (e qualsiasi codice che deve chiamare quella funzione) in una funzione con ambito come questa: (function(){/*your code here*/})();Ciò manterrebbe la funzione setFocus al sicuro da essere chiamata e il booleano verrà modificato da script esterni.
Xandor,
Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.