Question

如何在website上修复此问题？内底形式。我在第二个输入（电话）上使用input mask。当我禁用此插件选项卡工作正常。

这是我的代码输入掩码：

$(".tel").inputmask("+7 999 999 9999",{
    placeholder: " ",
    clearMaskOnLostFocus: true,
    showMaskOnHover: false,
    "oncomplete": function(){
        $(this).removeClass('error-input');
        $(this).addClass('valid-input')
    },
    "onincomplete": function(){
        $(this).siblings('.valid-tel-hint').hide();
        $(this).removeClass('valid-input');
    },
    "oncleared": function(){
        $(this).siblings('.valid-tel-hint').hide();
        $(this).removeClass('valid-input');
        $(this).removeClass('error-input');
    }
});

Answer 1

这是chrome中的一个错误，以下是对它的讨论：Chrome Tab Scroll Bug

对于已经包含数据的文本字段，这是一个错误。使用某些静态文本（例如上面的+7）在字段上创建输入掩码会在对其进行Tab键化时将文本放入字段中，从而导致错误。即使没有输入掩码，您也可以通过将文本放在普通字段中以及在它们之间来回切换来重现。

我已经整理了一个可行的小型hacky解决方案。权衡是当你选择到该字段时，文本会有一个非常快速的“闪现”。有点讨厌，但比滚动屏幕上的用户更好！

**注意我是一个javascript新手，所以我确信有更好的方法来实现这一点。

// create a closure around the field to keep the value scoped
var ChromeScrollFixForInputMaskTextField = function(text_field, default_value, mask_options)

    // set the starting value
    var input_value = text_field.val() !== '' ? text_field.val() : default_value;

    text_field.inputmask(mask_options);

    // When tabbing in, clear the value, and add it back after 10 milliseconds.
    // You can experiment with that time, just has to be long enough for Chrome
    //  to have acted trying to scroll to a filled text field.
    text_field.on('focus', function () {
        text_field.val('');
        setTimeout(function () {
            text_field.val(input_value);
        }, 10);
    });

    // Save the value when tabbing out so you can 'cheat' later
    text_field.on('blur', function () {
        input_value = text_field.val();
    });

};

// To use, simply grab a text field, and create the closure
my_text_field = $('#my_text_field');
mask_options = { mask: "9[999][.][99]", 'placeholder': '', greedy: false }
new ChromeScrollFixForInputMaskTextField(my_text_field, '1.0', mask_options)

您可以使用普通文本字段执行此操作，方法是在此函数内部检查以查看掩码是否存在，并且仅在设置时进行设置。

如何修复在第一个输入屏幕上单击选项卡时滚动到顶部。仅限Chrome

1 个答案: