Rilevamento JavaScript del contesto di pressione dei tasti (selezione della cronologia dei moduli e invio dei moduli)

StackOverflow https://stackoverflow.com/questions/416220

Domanda

Sto scrivendo un plug-in semi-generico utilizzando jQuery per accelerare lo sviluppo del progetto su cui sto lavorando.

Il piano è che un jTemplates contiene i campi, il mio plugin cerca attraverso il modello per trovare richiedeva risorse multilingue, le richiede dal server e quindi impacchetta tutto in un oggetto JavaScript che viene quindi passato a una funzione personalizzata su " submit " ;.

Tutto funziona correttamente, tranne lo standard "quando si preme Invio, inviare il modulo" codice che devi fare quando stai falsificando un modulo:

opts.coreElement.find('input[type=text]').keypress(function(evt) {
    if ((evt.keyCode || evt.which) == 13) {
        opts.coreElement.find('.saveButton').click();
    }
});

Il problema è che in Firefox (almeno; non ho ancora controllato altri browser), se in precedenza hai inserito informazioni in una casella di testo con nomi simili, ottieni la cronologia dei moduli. Se poi selezioni uno di quei valori suggeriti premendo invio, invia il modulo. Non eccezionale se sei al primo input nella pagina. Davvero piuttosto fastidioso, in realtà.

La soluzione ovvia sembra essere quella di inserire un elemento modulo attorno ai campi e fermare ogni possibile invio di questo modulo fittizio tramite jQuery. Fortunatamente, ho il lusso di farlo come in ASP.NET MVC, ma se non lo fossi? Cosa accadrebbe se il mio plugin non sapesse se era già all'interno di un modulo e quindi doveva mantenersi autonomo? E se fossi nei WebForm standard ASP.NET e avessi manualmente " target " la chiave di ritorno di ciascun input per il pulsante di invio corretto?

Esiste un modo, forse attraverso l'oggetto evento stesso, per rilevare il contesto del tasto premuto, in modo da poter filtrare la selezione degli elementi della cronologia dei moduli?

È stato utile?

Soluzione

Imposta l'attributo completamento automatico nei tuoi campi di testo su off :

opts.coreElement.find('input[type=text]').each(function() {
     $(this).attr('autocomplete', 'off');
});

Funziona con tutti i principali browser (Safari, Firefox, IE).

Altri suggerimenti

Ho scoperto che per impedire l'azione predefinita per un evento chiave [invio] o [tab] devi ascoltare l'evento keydown e gestirlo / annullarlo.
Al momento dell'attivazione del keyup o della pressione dei tasti, l'impostazione predefinita per il keydown è già avvenuta.

La risposta di wulong funziona ma non ha risposto completamente alla domanda. La soluzione proposta è disabilitare la cronologia del campo di testo di input. Ma c'è un modo per sapere se l'evento premuto dal tasto proviene dal testo di input o dalla cronologia?

Autorizzato sotto: CC-BY-SA insieme a attribuzione
Non affiliato a StackOverflow
scroll top