3

私はiPhoneスタイルのスクロールを提供するためにiScrollを使用しています。ただし、テキストボックスをクリックしても、キーボードは表示されません。

考えられる原因を見つけようとしたところ、iScrollスクリプトを削除すると正常に機能することがわかりましたが、その場合はスクロール機能がありません。

これはiScrollのバグですか。はいの場合、テスト済みの回避策はありますか？または、iScrollの代替手段はありますか？

前もって感謝します。

4

4 に答える 4

4

少なくともiScroll4では、このコードを追加して入力フィールドのクリックを有効にすることができます。examplesフォルダーのForm-fieldsのデモを参照してください。

<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>
于 2011-12-16T11:07:21.083 に答える
1

エラーを解決することができました。問題はCSSにありました。

CSSがどういうわけか問題を引き起こしているのではないかと思いました。wrapperとのCSSにコメントすると、キーボードが表示されたという理由でこれを結論付けましscrollerた...しかし、それらを保持すると、キーボードが機能しませんでした。を使用しbottom: 0px;ていたのですが、どういうわけかキーボードが表示されないようでした。

削除するbottom: 0px;と問題が解決しました。

これが他の人に役立つことを願っています。

于 2011-10-13T11:13:05.433 に答える
0

この問題を解決するために、iScroll4.2の_startに次のコードを追加しました。

  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に干渉しないようです（私は5秒ごとにiScroll.refresh（）を実行します）。

于 2012-10-19T11:19:31.267 に答える
0

このソリューションが最適だと思いますiscroll.jsのコードを微調整します（次のように）

onBeforeScrollStart: function (e) { 
                //e.preventDefault();
                if (e.target.nodeName.toLowerCase() == "select" || e.target.tagName.toLowerCase() == 'input' || e.target.tagName.toLowerCase() == 'textarea'){             
                    return;
                    } 
            },
于 2013-04-24T18:37:12.803 に答える