Di jQuery, bagaimana cara membedakan antara klik terprogram dan pengguna?

Katakanlah saya memiliki penangan klik yang ditentukan:

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

});

Bagaimana saya, di dalam penangan fungsi, mengetahui apakah peristiwa itu diaktifkan secara terprogram, atau oleh pengguna?

Anda bisa melihat objek acara e. Jika acara ini dipicu oleh klik nyata, Anda akan memiliki hal-hal suka clientX, clientY, pageX, pageY, dll di dalam edan mereka akan angka; angka-angka ini terkait dengan posisi mouse saat klik dipicu tetapi angka tersebut mungkin akan ada meskipun klik dimulai melalui keyboard. Jika peristiwa dipicu olehnya, $x.click()Anda tidak akan memiliki nilai posisi yang biasa di e. Anda juga dapat melihat originalEventproperti , yang seharusnya tidak ada di sana jika acara tersebut berasal $x.click().

Mungkin sesuatu seperti ini:

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

Dan inilah kotak pasir kecil untuk dimainkan: http://jsfiddle.net/UtzND/

Anda dapat menggunakan parameter tambahan seperti yang dinyatakan dalam manual pemicu jQuery :

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

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

Ada pertanyaan lain yang sudah terjawab.

Bagaimana cara mendeteksi jika klik () adalah klik mouse atau dipicu oleh beberapa kode?

Gunakan whichproperti objek acara. Ini harus undefineduntuk acara yang dipicu kode

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

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

Semoga membantu!

Saya telah mencoba semua solusi di atas. Tidak ada yang berhasil dalam kasus saya. Solusi di bawah ini berhasil untuk saya. Semoga ini akan membantu Anda juga.

$(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 Level 3 menentukan event.isTrusted. Ini hanya saat ini didukung di IE9 + dan Firefox (berdasarkan pengujian saya. Saya juga membaca (meskipun belum diteliti secara menyeluruh) bahwa ini dapat diganti di beberapa browser dan mungkin belum 100% siap untuk dipercaya (sayangnya).

Ini adalah versi modifikasi dari biola @ mu yang berfungsi di IE dan Firefox.

Solusi Vanila JS:

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

Tidak akan berpartisipasi dalam diskusi intelektual, kode yang bekerja untuk saya untuk menyaring .click()dan .trigger('click')adalah-

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