iPhone safari のフォーカス移動ボタンを無効にしたい

Question

前提・実現したいこと

iphone ブラウザ：safari環境において
フォーム入力時（フォーカス時）に出る、
キーボードなどの上部に表示される、[上矢印／下矢印]があります。
押すと入力部分をフォーカスが移動するのですが、
この[上矢印／下矢印]を表示させない、
または、フォーカス移動の機能を無効にすることはできないでしょうか？

発生している問題・エラーメッセージ

検証環境
デバイス： iPhone6s
OS: iOS 11.2.6
ブラウザ: safari

試したこと

input要素に tabindex="-1" を設定しましたが、効果ありません。

Answer 1

こちらの記事に以下のような実装が紹介されていましたが、こちらですといかがでしょうか？

$(document).ready(function() {
  // IOSか判定
  if (navigator.userAgent.match(/(iPod|iPhone|iPad)/)) {

    // 現在フォーカスが当たっているinput, textarea以外にreadonlyを設定
    $('input, textarea').on('focus', function() {
      $('input, textarea').not(this).attr("readonly", "readonly");
    });

    // フォーカスが外れるときにreadonlyを外す
    $('input, textarea').on('blur', function() {
      $('input, textarea').removeAttr("readonly");
    });

    // selectのtabindexに-1を設定
    $('select').attr('tabindex', '-1');
  }
});

Comments

[suzuki_A_suzuki]

回答ありがとうございます
上記方法を参考にして、javascriptをあててみました、
input へのフォーカス移動は無効にできましたが、selectへのフォーカス移動を防ぐことができません。
$('input, textarea, select').not(this).attr("readonly", "readonly");
としてもだめでした。
また、前述しましたが
tabindex = "-1"
は上手くいきません。

[suzuki_A_suzuki]

select要素には以下を追加したら解決しました。
$('select').not(this).attr("disabled", "disabled");

Answer 2

//iOSのfocus移動を無効
if(os == 'ios'){
// 現在focusが当たっている以外にinput,textareaにreadonly, selectにdisabledを設定
$('input, textarea, select').on('focus', function() {
$('input, textarea').not(this).attr("readonly", "readonly");
$('select').not(this).attr("disabled", "disabled");
});
// focusが外れるときにreadonly,disabledを外す
$('input, textarea, select').on('blur', function() {
$('input, textarea').removeAttr("readonly");
$('select').removeAttr("disabled");
});
}