Evitare modal licenziamento a entrare pressione dei tasti

Question

ho predisposto un modale bootstrap con un modulo al suo interno, ho appena notato che quando si preme il tasto Invio, il modal viene respinto. C'è un modo per non ignorarlo quando si preme Invio?

ho cercato di attivare il modal con tastiera: false, ma che impedisce solo il licenziamento con il tasto ESC.

Answer 1

Ho appena avuto anche questo problema.
Il mio problema era che avevo un pulsante di chiusura nel mio modale

<button class="close" data-dismiss="modal">&times;</button> 

Premendo entrare nel campo di immissione causato questo pulsante per essere licenziato. L'ho cambiato in un'ancora invece e funziona come previsto ora (invio invia il modulo e non chiude il modale).

<a class="close" data-dismiss="modal">&times;</a> 

Senza la tua fonte, non posso confermare che la tua causa sia la stessa.

Answer 2

si può mettere il pulsante di accesso prima che il pulsante di annullamento e questo avrebbe risolto il problema si stanno avendo pure.

<div class="modal-footer"> 
    <button type="submit" class="btn primary">Login</button> 
    <button type="submit" class="btn" data-dismiss="modal">Cancel</button> 
</div> 

Answer 3

basta aggiungere il type = "button" attributo all'elemento tasto, alcuni browser interpretano al tipo presentare per impostazione predefinita.

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#Attributes

Questo vale per tutti i pulsanti che avete nel modale.

<button type="button" class="close" data-dismiss="modal">×</button> 

Answer 4

Ho avuto questo problema anche dopo aver rimosso tutti i pulsanti dal mio Bootstrap modale, per cui nessuna delle soluzioni qui mi ha aiutato.

Ho trovato che un modulo con un campo di testo singolo induce il browser a inviare un modulo (e causare il respingimento), se premi Invio mentre lo stato attivo della tastiera è nel campo di testo. Questo sembra essere più un problema di browser/modulo che altro con Bootstrap.

La mia soluzione era quella di impostare l'attributo onsubmit del form onsubmit = "return false"

questo può essere un problema se in realtà si sta utilizzando l'evento di invio, ma sto utilizzando framework JS che generano richieste AJAX piuttosto piuttosto che inviare un browser, quindi preferisco disabilitare completamente l'invio. (Significa anche che non devo modificare manualmente ogni elemento del modulo che potrebbe innescare un invio).

Maggiori informazioni qui: Bootstrap modal dialogs with a single text input field always dismiss on Enter key

Answer 5

ho avuto anche questo problema ed ho risolto in questo modo. Ho aggiunto invio per formare. Volevo anche essere in grado di utilizzare tasto Invio come tasto di risparmio così ho aggiunto save_stuff) javascript (per onSubmit. restituisce falso; è usato per impedire che il modulo di invio.

<form onsubmit="save_stuff(); return false;"> 
... 
</form> 

<script> 
    function save_stuff(){ 
     //Saving stuff 
    } 
</script> 

Answer 6

ho avuto un'esperienza simile in questo momento e il modo in cui ho risolto era invece di utilizzare un tag, ho cambiato il tag ad un tag di tipo "pulsante" =. Questo sembrò risolvere il problema di premere il tasto "invio" e chiudere il modal bootstrap.

Answer 7

ho avuto lo stesso problema e ho risolto con

<form onsubmit="return false;"> 

ma c'è una soluzione in più, è possibile aggiungere ingresso invisibile fittizio, in modo che il modulo sarà simile a questa:

<form role="form" method="post" action="submitform.php"> 
    <input type="text" id="name" name="name" > 
    <input type="text" style="display: none;"> 
</form>