Question

我在一个有很多表格的网站上工作。我注意到当你在iphone上滚动/滑动网站时，如果你的手指在输入字段上，页面就不会滚动。要滚动你必须用手指瞄准身体。

任何人对于导致这种奇怪行为的原因有什么想法？

它只是简单的输入包装在表单标签中。

Answer 1

此问题的解决方法可能是：

function setTextareaPointerEvents(value) {
    var nodes = document.getElementsByTagName('textarea');
    for(var i = 0; i < nodes.length; i++) {
        nodes[i].style.pointerEvents = value;
    }
}

document.addEventListener('DOMContentLoaded', function() {
    setTextareaPointerEvents('none');
});

document.addEventListener('touchstart', function() {
    setTextareaPointerEvents('auto');
});

document.addEventListener('touchmove', function() {
    e.preventDefault();
    setTextareaPointerEvents('none');
});

document.addEventListener('touchend', function() {
    setTimeout(function() {
        setTextareaPointerEvents('none');
    }, 0);
});

这将使Mobile Safari（其他未经测试的人）忽略滚动的textareas，但允许像往常一样设置焦点等。

输入字段可防止页面在iphone上滚动

1 个答案: