In jQuery, come posso distinguere tra un clic programmatico e un clic utente?

Supponiamo di aver definito un gestore di clic:

$("#foo").click(function(e){

});

Come posso, all'interno del gestore della funzione, sapere se l'evento è stato attivato a livello di programmazione o dall'utente?

Potresti dare un'occhiata all'oggetto evento e. Se l'evento è stata innescata da un vero e proprio scatto, avrai le cose come clientX, clientY, pageX, pageY, ecc dentro ee saranno i numeri; questi numeri sono relativi alla posizione del mouse quando viene attivato il clic ma probabilmente saranno presenti anche se il clic è stato avviato tramite la tastiera. Se l'evento è stato attivato da $x.click()allora non avrai i soliti valori di posizione in e. Potresti anche guardare la originalEventproprietà , che non dovrebbe essere lì se l'evento provenisse $x.click().

Forse qualcosa del genere:

$("#foo").click(function(e){
    if(e.hasOwnProperty('originalEvent'))
        // Probably a real click.
    else
        // Probably a fake click.
});

Ed ecco un piccolo sandbox con cui giocare: http://jsfiddle.net/UtzND/

È possibile utilizzare un parametro aggiuntivo come indicato nel manuale del trigger jQuery :

$("#foo").click(function(e, from){
    if (from == null)
        from = 'User';
    // rest of your code
});

$('#foo').trigger('click', ['Trigger']);

C'è già una risposta a un'altra domanda.

Come rilevare se un clic () è un clic del mouse o attivato da un codice?

Usa la whichproprietà dell'oggetto evento. Dovrebbe essere undefinedper eventi attivati ​​da codice

$("#someElem").click(function(e) {
    if (e.which) {
        // Actually clicked
    } else {
        // Triggered by code
    }
});

Esempio di JsFiddle: http://jsfiddle.net/interdream/frw8j/

Spero che sia d'aiuto!

Ho provato tutte le soluzioni di cui sopra, nel mio caso non è stato funzionato nulla. La soluzione sotto ha funzionato per me. Spero che possa aiutare anche te.

$(document).ready(function(){
  //calling click event programmatically
    $("#chk1").trigger("click");
});

$(document).on('click','input[type=checkbox]',function(e) {
		if(e.originalEvent.isTrusted==true){
			alert("human click");
		}
		else{
			alert("programmatically click");
		}
    
    });

<script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.3.1.min.js">
</script>

<input type="checkbox" id="chk1" name="chk1" >Chk1</input>
<input type="checkbox" id="chk2" name="chk2" >Chk2</input>
<input type="checkbox" id="chk3" name="chk3" >Chk3</input>

DOM Livello 3 specifica event.isTrusted. Questo è attualmente supportato solo in IE9 + e Firefox (in base ai miei test. Ho anche letto (anche se non studiato a fondo) che può essere sovrascritto in alcuni browser e probabilmente non è ancora pronto al 100% per essere effettivamente attendibile (sfortunatamente).

Questa è una versione modificata del violino di @ mu che funziona su IE e Firefox.

Soluzione Vanila js:

document.querySelector('button').addEventListener('click', function (e){
    if(e.isTrusted){
        // real click.
    }else{
        // programmatic click
    }
});

Non parteciperò alla discussione intellettuale, il codice che ha funzionato per me per filtrare .click()ed .trigger('click')è-

$(document).on('click touchstart', '#my_target', function(e) {
    if (e.pageX && e.pageY) { // To check if it is not triggered by .click() or .trigger('click')
        //Then code goes here
    }
});