入力ボックスを読み取り専用にIOSシステムの入力、キーパッド上の矢印を下に隠されました

特定の場面でのビジネスは、読み取り専用にするように設定されますキーボードの矢印が表示されます上下、IOSサファリで撮影した際に、入力、入力ボックスの入力フォーカス、このユーザーエクスペリエンスは、それを取り除くためにどのように、非常に悪いのですか？

<input readonly="readonly"/>

アイデアについての講演：

上下の矢印は、メタタグではないか、彼らは矢印とそのイベントを聞くことができないため、HTMLのプロパティを設定することで対処するイベントをリッスン。これらの矢印は、ユーザーが簡単に上下に自由に複数の入力を切り替えることができるようにすることを意図しています。

しかし、入力ボックスの状態のために読み取り専用で、ユーザーはそう矢印を取り出すべきではありません。

唯一のオプションはある当输入被聚焦时禁用表单中的所有其他输入ので、上下に切り替えるとタブを表示されません。

詳細な説明方法はreadoblyパラメータを追加して、すべての入力とTEXTAREAエレメントのための選択入力より、入力フォーカスです。

select要素のために、追加のtabindex = -1パラメータので、リストは切り替わりません。

$(document).ready(function() {
  // 判断是否是IOS
  if (navigator.userAgent.match(/(iPod|iPhone|iPad)/)) {

    $('input, textarea').on('focus', function() {
      $('input, textarea').not(this).attr("readonly", "readonly")
    })
    $('input, textarea').on('blur', function() {
      $('input, textarea').removeAttr("readonly")
    })

    $('select').attr('tabindex', '-1')
  }
})