2014-06-19 21 views
6

Sto costruendo un'app Web utilizzando cordova per iOS. Ho questo moduloL'evento pulsante di invio modulo non viene catturato quando la tastiera è attiva iOS 7

<form id="formID"> 

    <div class="row"> 
    <input type="text" name="something1" placeholder="something1" class="form-control" required maxlength="26" /> 
    </div> 

    <div class="row"> 
    <input type="text" name="something2" placeholder="something2" class="form-control" pattern=".{6,6}" required /> 
    </div> 

    <div class="row"> 
    <input type="submit" value="Submit" class="button btn-primary" /> 
    </div> 

</form> 

Nel mio javascript ho quindi un listener per l'evento di invio.

Il mio problema è che quando la tastiera viene visualizzata in iOS, facendo clic sui pulsanti di invio non viene sempre attivato l'evento di invio. A volte funziona le prime 2 volte ma poi smette di funzionare. Qualcuno che si è imbattuto in questo prima?

Come ora potrebbe essere necessario fare prima clic su "Fatto" sulla tastiera (facendo sparire) e quindi utilizzare il pulsante di invio. Oppure, fai clic sul pulsante di invio con la tastiera che mostra che farà nascondere il keybpoard e quindi farà di nuovo clic sull'invio.

Qualche idea?

EDIT

Funziona bene su iOS 6, ma su iOS 7 il pulsante di invio non attivare un evento dopo le prime 2 clic.

+0

Ho riscontrato problemi simili, ma in genere quando tento di chiudere la tastiera facendo clic su un controllo che normalmente non risponde ai clic o ai tocchi. Un altro buon test è vedere se la tua pagina risponde allo stesso modo usando Mobile Safari; ciò ti aiuterà a isolare se questo è specifico di Cordova o più generale di UIWebkit. – Palpatim

risposta

5

Così ho risolto il problema che stavo avendo. Come indicato nella domanda ha funzionato bene per iOS6 e Android. Ma per iOS7 ho notato che quando ho aumentato l'altezza dei campi di testo sopra il pulsante di invio ho ricevuto il bug sopra descritto. Quando non ho aggiunto uno stile non predefinito che ha effettuato l'altezza degli elementi sopra il pulsante di invio lavorato. Strano giusto.

Ma poi ho letto questo question.

Quindi, invece di avere un pulsante di invio e il mio script attende l'attivazione dell'evento di invio, ho modificato il pulsante in un collegamento e ho ascoltato un evento touchend. Bam, ha funzionato come un fascino.

$(document).on('touchend', 'form #button', function (e) { 
    $('#formID').submit(); 
}); 

così ho lasciato questo evento bypass e attivare l'evento per inviare la clic sul pulsante "Go" sulla tastiera ancora attivare una funzione di invio.

+0

grazie allot! mi ha aiutato a correggere un bug con la tastiera su cui stavo lavorando per gli ultimi 2 giorni !! – sputn1k

Problemi correlati