Dans jQuery, comment puis-je distinguer un clic programmatique et utilisateur?

Disons que j'ai un gestionnaire de clics défini:

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

});

Comment puis-je, dans le gestionnaire de fonctions, savoir si l'événement a été déclenché par programme ou par l'utilisateur?

Vous pouvez jeter un œil à l'objet événement e. Si l'événement a été déclenché par un vrai clic, vous aurez des choses comme clientX, clientY, pageX, pageY, etc. à l' intérieur eet ils seront chiffres; ces chiffres sont liés à la position de la souris lorsque le clic est déclenché mais ils seront probablement présents même si le clic a été initié via le clavier. Si l'événement a été déclenché par, $x.click()vous n'aurez pas les valeurs de position habituelles dans e. Vous pouvez également regarder la originalEventpropriété , qui ne devrait pas être là si l'événement venait $x.click().

Peut-être quelque chose comme ça:

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

Et voici un petit bac à sable avec lequel jouer: http://jsfiddle.net/UtzND/

Vous pouvez utiliser un paramètre supplémentaire comme indiqué dans le manuel du déclencheur jQuery :

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

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

Il y a déjà une autre question répondue.

Comment détecter si un clic () est un clic de souris ou déclenché par un code?

Utilisez la whichpropriété de l'objet événement. Cela devrait être undefinedpour les événements déclenchés par le code

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

Exemple JsFiddle - http://jsfiddle.net/interdream/frw8j/

J'espère que ça aide!

J'ai essayé toutes les solutions ci-dessus, rien n'a été travaillé dans mon cas. La solution ci-dessous a fonctionné pour moi. J'espère que cela vous aidera également.

$(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 Niveau 3 spécifie event.isTrusted. Ceci n'est actuellement pris en charge que dans IE9 + et Firefox (sur la base de mes tests. J'ai également lu (bien que pas de recherches approfondies) qu'il peut être remplacé dans certains navigateurs et n'est probablement pas encore prêt à 100% à faire confiance (malheureusement).

Il s'agit d'une version modifiée du violon de @ mu qui fonctionne sur IE et Firefox.

Solution Vanila js:

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

Je ne vais pas participer à la discussion intellectuelle, le code qui a fonctionné pour moi pour filtrer .click()et .trigger('click')est-

$(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
    }
});