In iOS8 Safari, gli ingressi di sola lettura sono gestiti in modo errato

Question

In Safari, iOS8, la messa a fuoco di una data o di un orario apre il selettore di data o ora e consente di modificare il contenuto dell'ingresso di sola lettura.

Quando si effettua la messa a fuoco in un input di testo, una barra degli strumenti viene visualizzata in basso con i pulsanti precedente, successivo e Fine, e non va via fino a toccare Fine, o viene toccato un altro input sulla pagina.

Quando l'ingresso è focalizzata programatically da JavaScript, nulla sta accadendo, ma: se un listener di eventi TouchStart viene aggiunto ad una parte della pagina, toccando dovunque si apre la data, l'ora picker, o la barra degli strumenti, anche se l'ascoltatore è vuoto.

codice di esempio:

<input id="test1" readonly /> 
<input id="test2" type="date" readonly /> 
<input id="test3" type="time" readonly /> 

<script> 
    document.getElementById('test1').focus(); 
    window.addEventListener('touchstart', function() {}); 
</script> 

esempio dal vivo: http://jsfiddle.net/cw3hump4/embedded/result/

Tutte le idee o soluzioni alternative su come evitare questo?

UPDATE:

Per motivi/accessibilità usabilità ho bisogno concentrarsi gestione: toccando l'ingresso si apre una finestra di dialogo, quando la finestra è chiusa, ho messo il back focus sull'ingresso. L'input deve essere di sola lettura, per evitare che la tastiera/selettore di data/selezione orari si aprano, ma non può essere disabilitato, quindi posso impostare un valore e concentrarmi su di esso.

Answer 1

credo che questo sia un bug in Safari iOS 8

Ecco la soluzione con jQuery.

$(function() { 
    $('input[readonly]').on('touchstart', function(ev) { 
    return false; 
    }); 
}); 

EDIT:

come su questo?

$(function() { 
    $('input[readonly]').on('focus', function(ev) { 
    $(this).trigger('blur'); 
    }); 
}); 

Answer 2

Prova avvolgendo gli elementi di input in un modulo elementi, come

<form><input id="test1" readonly /></form> 
<form><input id="test2" type="date" readonly /></form> 
<form><input id="test3" type="time" readonly /></form> 

iOS 8 non come elementi di input non thats avvolto in un elemento del modulo, sembra essere un problema che iOS 8.