Подтвердить что ты не робот

Элемент выбора вызывает прокрутку вверх страницы на устройствах iOS

У меня есть сайт Bootstrap с элементом <select> внутри модального.

Моя проблема в том, что в iOS (на iPhone 5), когда я пытаюсь открыть select, чтобы выбрать option, фоновое содержимое (позади модального) автоматически прокручивается вверх в верхней части страницы.

Я получаю эту ошибку в Safari и Поиске Google, а не в браузерах Chrome и Mercury.

Кто-нибудь знает причину и решение этой проблемы? Благодаря

Ответ 1

У меня такая же проблема и найдено решение, которое действительно решает эту проблему:

if( navigator.userAgent.match(/iPhone|iPad|iPod/i) ) {

    $('.modal').on('show.bs.modal', function() {

        // Position modal absolute and bump it down to the scrollPosition
        $(this)
            .css({
                position: 'absolute',
                marginTop: $(window).scrollTop() + 'px',
                bottom: 'auto'
            });

        // Position backdrop absolute and make it span the entire page
        //
        // Also dirty, but we need to tap into the backdrop after Boostrap 
        // positions it but before transitions finish.
        //
        setTimeout( function() {
            $('.modal-backdrop').css({
                position: 'absolute', 
                top: 0, 
                left: 0,
                width: '100%',
                height: Math.max(
                    document.body.scrollHeight, document.documentElement.scrollHeight,
                    document.body.offsetHeight, document.documentElement.offsetHeight,
                    document.body.clientHeight, document.documentElement.clientHeight
                ) + 'px'
            });
        }, 0);
    });
}

Надеюсь, что это будет полезно для других, у кого будет такая же проблема.

Ответ 2

Я давно столкнулся с подобной проблемой для iPad-устройства. использование event.preventDefault() в javascript разрешило проблему.