如果您触摸输入字段，iPhone上的长形式Bootstrap 3模式不会滚动 [英] Bootstrap 3 modal with long form on iPhone doesn't scroll if you touch input field

问题描述

我正在使用Bootstrap 3，我有一个很长的表单，用户需要滚动才能访问所有字段。发生的事情是，如果您触摸输入字段以启动滚动它就会锁定。这不会发生在Android手机上。

I'm using Bootstrap 3 and I have a long form that users will need to scroll to get to all of the fields. What is happening is if you touch an input field to start your scroll it just locks up. This doesn't happen on android phones.

我无法给你一个指向我的确切代码的链接，但如果你到这里点击iphone上的第一个演示，你会看到发生了什么： http://jschr.github.io/bootstrap-modal/

I can't give you a link to my exact code, but if you go here and click the first demo on iphone you'll see what's happening: http://jschr.github.io/bootstrap-modal/

我不确定是否有某种方法可以为那些输入字段提供一些触摸事件的痛处，允许滚动或什么。任何输入都会有所帮助。

I'm not sure if there's some way to give those input fields some sore of touch event that allows the scroll or what. Any input would be helpful.

此外，xcode中的iphone模拟器显示相同的内容。

Also, the iphone simulator in xcode shows the same thing.

推荐答案

我修复了一个非常类似的问题，偶尔在iPhone上，背景滚动而不是模态。尝试在模态上禁用webkit平滑滚动，并在打开模态时禁用正文上的所有滚动

I fixed a very similar issue where the occasionally on iPhone, the background scrolls rather than the modal. Try disabling webkit smooth scrolling on the modal, and disabling all scrolling on the body when a modal is open

body.modal-open {
    position: fixed;
    overflow: hidden;
    left:0;
    right:0;
}
.modal{
    -webkit-overflow-scrolling: auto;
}

这篇关于如果您触摸输入字段，iPhone上的长形式Bootstrap 3模式不会滚动的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！