Metode lintas-browser terbaik untuk menangkap CTRL + S dengan JQuery?

Pengguna saya ingin dapat menekan Ctrl+ Suntuk menyimpan formulir. Apakah ada cara lintas-browser yang baik untuk menangkap kombinasi tombol Ctrl+ Sdan mengirimkan formulir saya?

Aplikasi dibangun di atas Drupal, jadi jQuery tersedia.

$(window).keypress(function(event) {
    if (!(event.which == 115 && event.ctrlKey) && !(event.which == 19)) return true;
    alert("Ctrl-S pressed");
    event.preventDefault();
    return false;
});

Kode kunci dapat berbeda di antara browser, jadi Anda mungkin perlu memeriksa lebih dari 115.

Ini berfungsi untuk saya (menggunakan jquery) untuk membebani Ctrl+ S, Ctrl+ Fdan Ctrl+ G:

$(window).bind('keydown', function(event) {
    if (event.ctrlKey || event.metaKey) {
        switch (String.fromCharCode(event.which).toLowerCase()) {
        case 's':
            event.preventDefault();
            alert('ctrl-s');
            break;
        case 'f':
            event.preventDefault();
            alert('ctrl-f');
            break;
        case 'g':
            event.preventDefault();
            alert('ctrl-g');
            break;
        }
    }
});

Anda dapat menggunakan pustaka pintasan untuk menangani hal-hal khusus peramban.

shortcut.add("Ctrl+S",function() {
    alert("Hi there!");
});

Solusi jQuery ini berfungsi untuk saya di Chrome dan Firefox, untuk Ctrl+ Sdan Cmd+ S.

$(document).keydown(function(e) {

    var key = undefined;
    var possible = [ e.key, e.keyIdentifier, e.keyCode, e.which ];

    while (key === undefined && possible.length > 0)
    {
        key = possible.pop();
    }

    if (key && (key == '115' || key == '83' ) && (e.ctrlKey || e.metaKey) && !(e.altKey))
    {
        e.preventDefault();
        alert("Ctrl-s pressed");
        return false;
    }
    return true;
}); 

Yang ini bekerja untuk saya di Chrome ... untuk beberapa alasan event.whichmengembalikan huruf kapital S (83) untuk saya, tidak yakin mengapa (terlepas dari status caps lock) jadi saya menggunakan fromCharCodedan toLowerCasehanya untuk berada di sisi yang aman

$(document).keydown(function(event) {

    //19 for Mac Command+S
    if (!( String.fromCharCode(event.which).toLowerCase() == 's' && event.ctrlKey) && !(event.which == 19)) return true;

    alert("Ctrl-s pressed");

    event.preventDefault();
    return false;
});

Jika ada yang tahu mengapa saya mendapatkan 83 dan tidak 115 , saya akan senang mendengar, juga jika ada yang menguji ini di browser lain saya akan senang mendengar apakah itu berfungsi atau tidak

Saya menggabungkan beberapa opsi untuk mendukung FireFox, IE dan Chrome. Saya juga memperbaruinya untuk dukungan mac yang lebih baik

// simply disables save event for chrome
$(window).keypress(function (event) {
    if (!(event.which == 115 && (navigator.platform.match("Mac") ? event.metaKey : event.ctrlKey)) && !(event.which == 19)) return true;
    event.preventDefault();
    return false;
});

// used to process the cmd+s and ctrl+s events
$(document).keydown(function (event) {
     if (event.which == 83 && (navigator.platform.match("Mac") ? event.metaKey : event.ctrlKey)) {
        event.preventDefault();
        save(event);
        return false;
     }
});

Saya ingin aplikasi Web tidak menimpa kunci pintas default saya, jujur. Ctrl+ Ssudah melakukan sesuatu di browser. Memiliki perubahan itu tiba-tiba tergantung pada situs yang saya lihat mengganggu dan membuat frustrasi, belum lagi sering buggy. Saya memiliki situs yang dibajak Ctrl+ Tabkarena tampilannya sama dengan Ctrl+ I, keduanya merusak pekerjaan saya di situs dan mencegah saya beralih tab seperti biasa.

Jika Anda ingin tombol pintas, gunakan accesskeyatribut. Tolong jangan hancurkan fungsionalitas browser yang ada.

@Eevee: Karena peramban menjadi rumah bagi fungsionalitas yang lebih kaya dan lebih kaya dan mulai mengganti aplikasi desktop, itu tidak akan menjadi pilihan untuk tidak menggunakan pintasan keyboard. Rangkaian perintah keyboard yang kaya dan intuitif dari Gmail sangat membantu dalam kesediaan saya untuk meninggalkan Outlook. Pintasan keyboard di Todoist, Google Reader, dan Google Calendar semuanya membuat hidup saya jauh lebih mudah setiap hari.

Pengembang harus berhati-hati untuk tidak mengabaikan penekanan tombol yang sudah memiliki arti di browser. Sebagai contoh, kotak teks WMD yang saya ketikkan ke dalam interpretasi yang tidak dapat dijelaskan Ctrl+ Delsebagai "Blockquote" daripada "delete word forward". Saya ingin tahu apakah ada daftar standar cara pintas "aman-peramban" yang dapat digunakan pengembang situs dan bahwa peramban akan berkomitmen untuk menjauh dari versi yang akan datang.

$(document).keydown(function(e) {
    if ((e.key == 's' || e.key == 'S' ) && (e.ctrlKey || e.metaKey))
    {
        e.preventDefault();
        alert("Ctrl-s pressed");
        return false;
    }
    return true;
}); 

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
Try pressing ctrl+s somewhere.

Ini adalah versi terbaru dari jawaban @ AlanBellows, yang diganti whichdengan key. Itu juga berfungsi bahkan dengan kesalahan kunci huruf besar Chrome (di mana jika Anda menekan Ctrl+ Situ mengirim huruf kapital S bukannya s). Bekerja di semua browser modern.

Ini adalah solusi saya, yang jauh lebih mudah dibaca daripada saran lain di sini, dapat dengan mudah memasukkan kombinasi tombol lainnya, dan telah diuji pada IE, Chrome, dan Firefox:

$(window).keydown(function(evt) {
    var key = String.fromCharCode(evt.keyCode);
    //ctrl+s
    if (key.toLowerCase() === "s" && evt.ctrlKey) {
        fnToRun();
        evt.preventDefault(true);
        return false;
    }
    return true;
});

Saya suka plugin kecil ini . Perlu sedikit lebih ramah browser lintas.

Ini harus berfungsi (diadaptasi dari https://stackoverflow.com/a/8285722/388902 ).

var ctrl_down = false;
var ctrl_key = 17;
var s_key = 83;

$(document).keydown(function(e) {
    if (e.keyCode == ctrl_key) ctrl_down = true;
}).keyup(function(e) {
    if (e.keyCode == ctrl_key) ctrl_down = false;
});

$(document).keydown(function(e) {
    if (ctrl_down && (e.keyCode == s_key)) {
        alert('Ctrl-s pressed');
        // Your code
        return false;
    }
}); 

contoh:

shortcut.add("Ctrl+c",function() {
    alert('Ok...');
}
,{
    'type':'keydown',
    'propagate':false,
    'target':document
});

pemakaian

<script type="text/javascript" src="js/shortcut.js"></script>

tautan untuk unduhan: http://www.openjs.com/scripts/events/keyboard_shortcuts/#

Untuk jawaban Alan Bellows:! (E.altKey) ditambahkan untuk pengguna yang menggunakan AltGrsaat mengetik (mis. Polandia). Tanpa menekan AltGr+ ini Sakan memberikan hasil yang sama dengan Ctrl+S

$(document).keydown(function(e) {
if ((e.which == '115' || e.which == '83' ) && (e.ctrlKey || e.metaKey) && !(e.altKey))
{
    e.preventDefault();
    alert("Ctrl-s pressed");
    return false;
}
return true; });

Plugin ini Dibuat oleh saya semoga bermanfaat.

Plugin

Anda dapat menggunakan plugin ini Anda harus menyediakan Kode kunci dan fungsinya untuk dijalankan seperti ini

simulatorControl([17,83], function(){
 console.log('You have pressed Ctrl+Z');
});

Dalam kode, saya telah menampilkan cara melakukan untuk Ctrl+ S. Anda akan mendapatkan Dokumentasi Lengkap di tautan tersebut. Plugin ada di bagian Kode JavaScript Pena saya di Codepen.

Saya memecahkan masalah saya di IE , menggunakan alert("With a message")untuk mencegah Perilaku default:

window.addEventListener("keydown", function (e) {
    if(e.ctrlKey || e.metaKey){
        e.preventDefault(); //Good browsers
        if (navigator.userAgent.indexOf('MSIE') !== -1 || navigator.appVersion.indexOf('Trident/') > 0) { //hack for ie
            alert("Please, use the print button located on the top bar");
            return;
        }
    }
});