iPad网络应用程序：在ajax调用之后防止输入焦点答案

【问题标题】：iPad web app: Prevent input focus AFTER ajax calliPad网络应用程序：在ajax调用之后防止输入焦点
【发布时间】：2014-07-28 00:45:37
【问题描述】：

因此，我已经阅读了很多内容，但终生无法有效地解决我的问题。

简而言之，我有一个为 iPad 构建的网络应用程序——它可以正常工作。但是，我有一个 Ajax 表单，它也应该提交。但是，在callback 和我清除/重置我的表单之后，“iPad”会自动关注输入并再次打开键盘。这远非理想。

我设法破解了它，但它仍然不完美。下面的代码是在我的 ajax 回调上运行的，它可以工作 - 除了键盘仍然会快速打开和关闭。

请注意，除非我使用 setTimeout，否则我的代码将无法运行。另外，据我了解，document.activeElement.blur();只有在有点击事件时才有效，所以我通过js触发了。

换句话说，如何防止键盘在 AJAX CALL ON WEB 应用程序后重新打开？

PS：Ajax 调用工作正常，不会在 iPad 上的 Safari 中打开键盘，只是 web 应用程序模式。

这是我的代码：

    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);
        }
    }

也许这与我清除表单的方式有关，所以这里是代码。请注意，所有输入的 tabindex="-1" 也是如此。

    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();
    }

【问题讨论】：

标签： jquery ios ajax ipad web-applications

【解决方案1】：

对于遇到此问题的任何其他人，我在表单上放置了一个“覆盖”div absolute（用作我在 ajax 成功时显示的感谢消息）。显然，这导致键盘在 Ajax 调用后打开。出于 UI 原因，我将位置更改为position: fixed;，我最初的问题中突出显示的问题似乎神秘地自行解决了。奇怪...很想知道为什么。

【讨论】：