Gestione combinazione di tasti “ctrl+s’ evento keypress per browser


Stavo cercando di implementare il CTRL+S funzionalità di un browser basato su applicazione.Ho fatto una ricerca e mi sono imbattuto 2 script in seguito a domande

Miglior cross-browser metodo per catturare CTRL+S con JQuery?

Ctrl+S preventDefault in Chrome

Tuttavia,quando ho provato a implementare,ha funzionato,ma ho ancora il browser di default salva finestra di dialogo finestra/.

Il Mio Codice:Per shortcut.js

 shortcut.add("Ctrl+S",function() {
     alert("Hi there!");
 },
 {
     'type':'keydown',
     'propagate':false,
     'target':document
});

jquery hotkeys.js

$(document).bind('keydown', 'ctrl+s', function(e) {
    e.preventDefault();
    alert('Ctrl+S');
    return false;
});

Credo e.preventDefault(); dovrebbe fare il trucco,ma per qualche motivo non funziona.Dove vado errato.Scusate se è semplice,ancora di apprendimento javascript.
Grazie per il vostro tempo.

  • Il 2 ° per me funziona. Che browser stai usando e che versione è?
  • L’ho provato su chrome,FF e IE 8,9.Credo che se io avviso, porta la finestra di default con esso!!Se faccio un console.log,non visualizzare la finestra!! 😛 Perché è così?
InformationsquelleAutor coderunner | 2013-01-28



5 Replies
  1. 21

    Non hai bisogno di alcuna di queste librerie, basta provare questo:

    $(document).on('keydown', function(e){
        if(e.ctrlKey && e.which === 83){ //Check for the Ctrl key being pressed, and if the key = [S] (83)
            console.log('Ctrl+S!');
            e.preventDefault();
            return false;
        }
    });

    Il problema è che il codice si fermò davanti alla alert(), impedendo la funzione di interrompere la finestra di dialogo.

    (Ancora utilizza jQuery)

    • Sì Cerbus ho fatto lo stesso!Ma per avviso di essa si apre la finestra(ho provato avviso prima come esempi avuto).Ma per console.log,e sembra funzionare bene!! Qualsiasi problema con lo script o è il comportamento di default?? 😛
    • Ah, quindi il problema era che il alert era in pausa il codice prima di poter interrompere la finestra di dialogo salva da mostrare.
    • Sì ha ottenuto il vostro punto di Cerbus!!Grazie!!Sto andando jquery modo come io non sono sicuro che avrei bisogno di ulteriori tagli corti nella domanda!Ero un po ‘ stupido che c’è!! 😛
    • si sono consapevole che il mio codice è esattamente la stessa risposta che hai accettato, giusto? (Tranne che ho postato in precedenza). Solo l’altra risposta ad usare la vecchia .bind() funzione, che i ragazzi oltre a jQuery suggeriscono di non utilizzare più. Il 'ctrl+s' sembra essere dati che non sono utilizzati ovunque, sia.
    • Non ho accettato per la risposta,ho usato il mio attuazione.La risposta è stata accettata basato sulla spiegazione aggiunto in esso(che era quello che stavo cercando).Ero confuso con l’avviso di parte.I con voto positivo la tua risposta con il dovuto rispetto.Si prega di non mente, senza offesa.Entrambe le risposte sono altrettanto rapido e informativo e guardare avanti per il vostro sostegno.
    • assicurarsi che oltre a lavorare per voi, la risposta è davvero buona pratica. A volte, dopo la risposta viene accettato, un altro arriva, scoprendo il fatto che la precedente era in realtà una cattiva hack.. Che è tutto ciò che dirò.
    • Grazie per le info.Sarà da tenere a mente!!È cambiato qualcosa per la comunità.
    • Penso che si può anche migliorare la vostra soluzione con switch() funzione e di espandere la vostra risposta per ogni altro pulsante, come Ctrl + B, Ctrl + I e …
    • Che sarebbe passato la portata della questione.

  2. 14

    Questo è quello di aggiungere solo una diversa attuazione alla domanda da me utilizzati.
    Adattato da un MODO di rispondere.Inoltre,funziona per MAC

     document.addEventListener("keydown", function(e) {
          if (e.keyCode == 83 && (navigator.platform.match("Mac") ? e.metaKey : e.ctrlKey))      {
            e.preventDefault();
            //your implementation or function calls
          }
        }, false);
  3. 2

    Persone sono ancora la visione di questo sembra, quindi, è probabilmente vale la pena di sottolineare che non c’è bisogno di jQuery su questo, qui:

    function keydown (event) {
        var isCtrlKeyDown = navigator.platform.indexOf("Mac") > -1 ? event.metaKey : event.ctrlKey,
            isSDown = (event.key && event.key === "s") || (event.keyCode || event.which) === 83 //falls back to keycode if no event.key
    
        if (isCtrlKeyDown && isSDown) {
            //prevent default event on newer browsers
            if (event.preventDefault) {
                event.preventDefault()
            }
    
    
            //... your code here ...
    
    
            //prevent default event on older browsers
            return false
        }
    }
    
    //register the event
    if (document.addEventListener) {
        document.addEventListener("keydown", keydown)
    } else {
        document.onkeydown = keydown
    }

    Che dovrebbe funzionare in tutti i browser, questo funziona anche per la gente che utilizza alternativa dal layout di tastiera QWERTY su Windows, che i rapporti non corretti codici chiave (almeno su Chrome 56 su Windows 10 nel mio test)

    Tuttavia, questo risulta un po ‘ goffo e confuso, così se si sono solo sostenere i browser moderni, si può fare invece la seguente:

    document.addEventListener("keydown", function keydown (event) {
        if (navigator.platform === "MacIntel" ? event.metaKey : event.ctrlKey && event.key === "s") {
            event.preventDefault()
    
            //... your code here ...
        }
    })
  4. 1

    Non c’è bisogno di utilizzare alcun plugin, basta usare sotto il codice jquery

    $(document).bind('keydown', 'ctrl+s', function (e) {
            if (e.ctrlKey && (e.which == 83)) {
    
                e.preventDefault();
                //Your method()
                return false;
            }
        });

    Dal momento che si sta utilizzando avviso, l’esecuzione si interrompe all’erta e “return false” non viene eseguito finché non si chiude la casella di allarme, questo è il motivo si vede la finestra di dialogo predefinita.

    Se il tuo metodo è lunga l’esecuzione di un migliore utilizzo poli metodo, invece.

  5. 1

    Dal 2017, invece di utilizzare e.keyCode === 83 si dovrebbe usare e.key === 's' in quanto il primo è deprecato.

Lascia un commento