Cara pasti untuk memicu peristiwa penekanan tombol dengan jQuery

260

Saya sudah membaca semua jawaban untuk pertanyaan ini dan tidak ada solusi yang tampaknya berhasil.

Juga, saya mendapatkan getaran yang memicu penekanan tombol dengan karakter khusus tidak bekerja sama sekali. Dapatkah seseorang memverifikasi siapa yang telah melakukan ini?

— mkoryak
sumber

14

Tidak, Anda tidak mengerti konsepnya. Ini bukan bagaimana seharusnya bekerja. trigger hanya akan memanggil event handler. Sebenarnya tidak akan mencetak kunci. Jika Anda ingin mensimulasikan efek mencetak kunci, maka cukup tambahkan kunci ke nilai input dan memicu acara pada saat yang sama.

— Nadia Alramli

Menarik, saya tidak tahu itu. Jika demikian, dapatkah Anda memberi tahu saya jika memicu acara juga akan memicunya untuk lib non-jquery. misalnya jika saya memiliki onKeydown yang diatur dalam JS polos, apakah itu akan menangkap acara "palsu" saya?

— mkoryak

2

ya, jika ada onkeydown = '...' diatur dalam js polos. Itu akan dipicu oleh acara palsu. Saya tidak yakin tentang itu. Tapi saya membuat tes cepat dan berhasil.

— Nadia Alramli

2

@Nadia Terima kasih untuk itu! Saya sudah membaca semua jawaban dan bertanya-tanya mengapa semuanya tidak berhasil sebelum menyadari harapan saya tidak benar. Saya curiga banyak orang lain akan memiliki kesalahpahaman yang sama.

— mikemaccana

3

Dua tahun kemudian ... membaca halaman, sepertinya cara definitifnya adalah: $ ('input # search'). Trigger ($. Event ('keydown', {yang: $. Ui.keyCode.ENTER, keyCode: $ .ui.keyCode.ENTER}));

— molokoloco

365

Jika Anda ingin memicu penekanan tombol atau acara keydown maka yang harus Anda lakukan adalah:

var e = jQuery.Event("keydown");
e.which = 50; // # Some key code value
$("input").trigger(e);

— Nadia Alramli
sumber

42

pertanyaannya adalah bagaimana memicu, bukan bagaimana menangkap

— Chad Grant

2

Saya menambahkan contoh untuk memicu acara

— Nadia Alramli

4

Jawaban yang sangat bagus Patut dicatat bahwa jQuery.Event tersedia untuk jQuery 1.3 atau lebih tinggi. Itu menjadi relevan dalam pertanyaan ini: stackoverflow.com/questions/1823617/…

— artlung

8

Ini tidak berhasil bagi saya dengan slider jQuery UI. Saya harus menetapkan e.keyCode seperti jawaban OreiA di bawah ini.

— crizCraig

2

fwiw, saya lebih sukses dengan 'keyup' untuk aplikasi saya

— tandai

81

Sedikit lebih ringkas sekarang dengan jQuery 1.6+ :

var e = jQuery.Event( 'keydown', { which: $.ui.keyCode.ENTER } );

$('input').trigger(e);

(Jika Anda tidak menggunakan jQuery UI, ganti dengan kode kunci yang sesuai.)

— nickb
sumber

4

Hanya ingat untuk mengganti 'keyCode' untuk 'yang' juga.

— Richard Nienaber

Ya, Anda harus menentukan yang mana dan keyCode agar aman (jika pendengar acara memeriksa e.keyCode, itu hanya akan berfungsi jika Anda mendefinisikan keyCode saat membuat objek jQuery.Event)

— jackocnr

1

jQuery menormalkan / keyCode yang memasukkan keduanya harus melakukan keduanya.

— Nigel Angel

+1 untuk tautan ke api.jquery.com; dan versi jQuery saat ini tidak menormalkan / keyCode mana, jadi Anda harus menyediakan keduanya untuk keselamatan

— Victor

2

@SamuelLindblom Seharusnya aku menulisnya lebih jelas: jQuery tidak menormalkan properti acara yang dilalui .trigger(jQuery.Event('name', props)). Lihatlah contoh jsfiddle.net/9ggmrbpd/1 - properti dari event yang dipicu dilewatkan begitu saja. Kode sumber: github.com/jquery/jquery/blob/master/src/event.js#L739

— Victor

68

Jawaban sebenarnya harus menyertakan keyCode:

var e = jQuery.Event("keydown");
e.which = 50; // # Some key code value
e.keyCode = 50
$("input").trigger(e);

Meskipun situs web jQuery mengatakan bahwa mana dan keyCode dinormalisasi, mereka sangat keliru. Itu selalu paling aman untuk melakukan pemeriksaan lintas-browser standar untuk e.which dan e.keyCode dan dalam hal ini hanya mendefinisikan keduanya.

— Tomas
sumber

34

+1. By the way, e.keyCode = e.which = 50;dalam satu baris akan lebih baik. :)

— Sk8erPeter

Saya baru tahu bahwa menggunakan saja keyCodetidak berhasil. Harus mengatur keduanya agar berfungsi

— Tasos K.

@ Sk8erPeter tidak akan kecuali itu kompetisi coding

— golph

18

Jika Anda menggunakan jQuery UI juga, Anda bisa melakukan ini:

var e = jQuery.Event("keypress");
e.keyCode = $.ui.keyCode.ENTER;
$("input").trigger(e);

— Rodrigo Chacon
sumber

1

e.yang sepertinya tidak berfungsi dengan slider jQuery UI saya. Terima kasih atas jawaban ini. Itu berhasil.

— crizCraig

5

Saya membuatnya bekerja dengan keyup.

$("#id input").trigger('keyup');

— Abba
sumber

3

dalam pertanyaan saya 6 tahun yang lalu, saya juga ingin mengatur kode kunci, tetapi tidak tahu caranya.

— mkoryak

4

Ok, buat saya yang bekerja dengan ini ...

var e2key = function(e) {
    if (!e) return '';
    var event2key = {
        '96':'0', '97':'1', '98':'2', '99':'3', '100':'4', '101':'5', '102':'6', '103':'7', '104':'8', '105':'9', // Chiffres clavier num
        '48':'m0', '49':'m1', '50':'m2', '51':'m3', '52':'m4', '53':'m5', '54':'m6', '55':'m7', '56':'m8', '57':'m9', // Chiffres caracteres speciaux
        '65':'a', '66':'b', '67':'c', '68':'d', '69':'e', '70':'f', '71':'g', '72':'h', '73':'i', '74':'j', '75':'k', '76':'l', '77':'m', '78':'n', '79':'o', '80':'p', '81':'q', '82':'r', '83':'s', '84':'t', '85':'u', '86':'v', '87':'w', '88':'x', '89':'y', '90':'z', // Alphabet
        '37':'left', '39':'right', '38':'up', '40':'down', '13':'enter', '27':'esc', '32':'space', '107':'+', '109':'-', '33':'pageUp', '34':'pageDown' // KEYCODES
    };
    return event2key[(e.which || e.keyCode)];
};

var page5Key = function(e, customKey) {
    if (e) e.preventDefault();
    switch(e2key(customKey || e)) {
        case 'left': /*...*/ break;
        case 'right': /*...*/ break;
    }
};

$(document).bind('keyup', page5Key);

$(document).trigger('keyup', [{preventDefault:function(){},keyCode:37}]);

— molokoloco
sumber

2

Jika Anda perlu mempertimbangkan kursor saat ini dan pemilihan teks ...

Ini tidak berfungsi untuk saya untuk aplikasi AngularJS di Chrome. Seperti yang ditunjukkan Nadia dalam komentar asli, karakter tidak pernah terlihat di kolom input (setidaknya, itulah pengalaman saya). Selain itu, solusi sebelumnya tidak memperhitungkan pemilihan teks saat ini di bidang input. Saya harus menggunakan pemilihan jquery perpustakaan yang indah .

Saya memiliki keypad numerik khusus di layar yang mengisi beberapa kolom input. Saya harus...

Pada fokus, simpan lastFocus.element

Dengan blur, simpan pilihan teks saat ini (mulai dan berhenti)

var pos = element.selection('getPos')
lastFocus.pos = { start: pos.start, end: pos.end}

Ketika tombol di keypad saya ditekan:

lastFocus.element.selection( 'setPos', lastFocus.pos)
lastFocus.element.selection( 'replace', {text: myKeyPadChar, caret: 'end'})

— Flint O'Brien
sumber

2

Tentu Anda ingin melakukannya dalam satu baris yang dapat Anda gunakan

$("input").trigger(jQuery.Event('keydown', { which: '1'.charCodeAt(0) }));

— Benjamin Udink sepuluh Cate
sumber

1

console.log( String.fromCharCode(event.charCode) );

Saya tidak perlu memetakan karakter.

— Weldan Jamili
sumber

1

Itu bisa dicapai seperti dokumen ini

$('input').trigger("keydown", {which: 50});

— Bek
sumber

1

Ini sepertinya tidak berfungsi karena ini menggunakan argumen extraParameters yang tidak mengatur apa pun di dalam argumen peristiwa tetapi menambahkan argumen tambahan ke pemanggilan kembali event handler.

— TimeWaster

1

Bukan solusi yang valid

— Entwickler