So habe ich herum gelesen und kann nicht für das Leben von mir herauszufinden, um mein Problem effektiv zu lösen.iPad Web App: Prevent Eingabefokus Nach Ajax Anruf
Kurz gesagt, ich habe eine Web-App für das iPad gebaut - die funktioniert wie es sollte. Allerdings habe ich eine Ajax-Form, die auch so vorlegt, wie es sollte. Aber, nach dem callback
und ich lösche/setze mein Formular, das "iPad" fokussiert automatisch auf einen Eingang und öffnet die Tastatur wieder. Das ist alles andere als ideal.
Ich habe es geschafft, mich herumzuhacken, aber es ist immer noch nicht perfekt. Der Code unten wird auf meinem Ajax-Callback ausgeführt, was funktioniert - außer es gibt immer noch einen Blitz, der sich schnell öffnet und schließt.
Hinweis, mein Code wird nicht funktionieren, wenn ich setTimeout
verwende. Auch von meinem Verständnis funktioniert document.activeElement.blur();
nur, wenn es ein Klickereignis gibt, also löste ich ein über js aus.
IN ANDEREN WORTEN, WIE VERHINDERE ICH DIE TASTATUR, NACH AJAX CALL ON WEB APP WIEDER ZU ÖFFNEN?
PS: Ajax Anruf funktioniert gut und öffnet nicht die Tastatur in Safari auf dem iPad, nur Web-App-Modus.
Hier ist mein Code:
hideKeyboard: function() {
// iOS web app only, iPad
IS_IPAD = navigator.userAgent.match(/iPad/i) != null;
if (IS_IPAD) {
$(window).one('click', function() {
document.activeElement.blur();
});
setTimeout(function() {
$(window).trigger('click');
}, 500);
}
}
Vielleicht ist es damit zusammen, wie ich meine Formulare bin Clearing, also hier ist, dass Code. Beachten Sie, dass alle Eingänge tabindex = "- 1" haben.
clearForm: function() {
// text, textarea, etc
$('#campaign-form-wrap > form')[0].reset();
// checkboxes
$('input[type="checkbox"]').removeAttr('checked');
$('#campaign-form-wrap > form span.custom.checkbox').removeClass('checked');
// radio inputs
$('input[type="radio"]').removeAttr('checked');
$('#campaign-form-wrap > form span.custom.radio').removeClass('checked');
// selects
$('form.custom .user-generated-field select').each(function() {
var selection = $(this).find('option:first').text(),
labelFor = $(this).attr('name'),
label = $('[for="' + labelFor + '"]');
label.find('.selection-choice').html(selection);
});
optin.hideKeyboard();
}
es ist super-hilfreich für andere, danke! – Fattie