IOS禁用键​​盘标签箭头

Question

我需要使用 JavaScript 禁用 IOS 上的键盘选项卡箭头，如果有的话，甚至需要使用基于 Web 的应用元标记。

我尝试了一些选项，但在选择菜单时遇到了问题。

我也无法将所有 tabindex 恢复为 -1，因为这会损害桌面和其他设备上的选项卡功能。

任何帮助将不胜感激。

这是我为字段跳转到只读所做的示例。

$(document).ready(function() {

  $('input, textarea, select').on('focus', function() {
    $('input, textarea').not(this).attr('readonly', 'readonly');
    $('select').not(this).attr("disabled", "disabled");
  });

  $('input, textarea, select').on('blur', function() {
    $('input, textarea').removeAttr("readonly");
    $('select').removeAttr("disabled");
  });

});

Answer 1

我实际上找到了一种很有效的方法。

我正在做的是检测仅限 IOS 的设备，然后禁用选项卡以输入字段。

我想我可以更进一步，检测 IOS 和 safari。

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

    // Only active input fields in use
    $('input, textarea').on('focus', function() {
      $('input, textarea').not(this).attr("readonly", "readonly");
    });
    $('input, textarea').on('blur', function() {
      $('input, textarea').removeAttr("readonly");
    });

    // Disable tabing to select box's
    $('select').attr('tabindex', '-1');
  }
});

Answer 2

这是一个无法通过设置 html 属性、元标记或监听特殊事件来解决的问题（那些箭头没有事件...）。

唯一的选择是在输入获得焦点时禁用表单中的所有其他输入，这样就没有输入选项卡。

不要编写此代码并重新发明轮子，这里是一个指向已经这样做的 jquery 模块的链接：https://github.com/ChrisWren/touch-input-nav

如果您想要纯 js 解决方案，请查看：https://github.com/ChrisWren/touch-input-nav/blob/master/touch-input-nav.js 没有那么多代码需要重写，所以这应该不是问题。