Использование iScroll предотвращает отображение клавиатуры на моем устройстве - PullRequest
Новая
       10

Использование iScroll предотвращает отображение клавиатуры на моем устройстве

3 голосов
/ 01 октября 2011

Я использую iScroll для обеспечения прокрутки в стиле iPhone. Но при нажатии на текстовые поля клавиатура не отображается.

Пытаясь найти возможную причину, я обнаружил, что удаление сценария iScroll делает его нормальным, но в этом случае мне не хватает функции прокрутки.

Это ошибка в iScroll. Если да, есть ли проверенный обходной путь? Или есть ли альтернатива для iScroll?

Заранее спасибо.

Ответы [ 4 ]

4 голосов
/ 16 декабря 2011

По крайней мере, в iScroll 4 вы можете добавить этот код, чтобы разрешить нажатие полей ввода. См. Демонстрацию полей формы в папке примеров. 

<script type="text/javascript">

var myScroll;
function loaded() {
    myScroll = new iScroll('wrapper', {
        useTransform: false,
        onBeforeScrollStart: function (e) {
            var target = e.target;
            while (target.nodeType != 1) target = target.parentNode;

            if (target.tagName != 'SELECT' && target.tagName != 'INPUT' && target.tagName != 'TEXTAREA')
                e.preventDefault();
        }
    });
}

document.addEventListener('touchmove', function (e) { e.preventDefault(); }, false);
document.addEventListener('DOMContentLoaded', loaded, false);

</script>
1 голос
/ 13 октября 2011

Мне удалось устранить ошибку. Проблема была с CSS.

Я подумал, что CSS как-то создает проблему. Я пришел к выводу, основываясь на том, что когда я комментировал CSS для wrapper и scroller, клавиатура обнаруживалась ... но, сохраняя их, клавиатура не работала. Я использовал bottom: 0px;, который, казалось, как-то мешал отображению клавиатуры.

Удаление bottom: 0px; решило мою проблему.

Надеюсь, это поможет другим.

0 голосов
/ 24 апреля 2013

Я считаю, что это решение является оптимальным Настройте код в iscroll.js, (следующим образом) 

onBeforeScrollStart: function (e) { 
                //e.preventDefault();
                if (e.target.nodeName.toLowerCase() == "select" || e.target.tagName.toLowerCase() == 'input' || e.target.tagName.toLowerCase() == 'textarea'){             
                    return;
                    } 
            },
0 голосов
/ 19 октября 2012

Я добавил следующий код для _start в iScroll 4.2 для решения этой проблемы: 

  if (e && e.target && e.target.tagName) {
    var bFocusField = ('|INPUT|TEXTAREA|BUTTON|SELECT|'
                         .indexOf('|' + e.target.tagName + '|') >= 0);
    if (bFocusField || that.focusField) {
      if (bFocusField) {
        that.focusField = e.target;
      } else {
        that.focusField.blur();
        that.focusField = null;
      }
      e.defaultPrevented = false;
      e.returnValue = true;
      return true;
    }
  }

Код вставляется ниже части инициализации функции (that.moved = false; ... that.dirY = 0;).

Протестировано на iPad 1 (iOS 5.1) и iPad 3 (iOS 6). Кажется, что экранная клавиатура не мешает работе iScroll (я делаю iScroll.refresh () каждые 5 секунд).

...