IOS禁用鍵​​盤選項卡箭頭

Question

我需要禁用IOS上的鍵盤選項卡箭頭，使用JavaScript或甚至基於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設備，然後禁用輸入字段的Tab鍵。

我想我可以更進一步，檢測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屬性，meta標籤或聽特殊事件需要解決的問題（還有那些箭頭沒有事件......）。

唯一的選擇是當輸入被聚焦時禁用表單中的所有其他輸入，以便沒有輸入選項卡。

而不是寫這個代碼，並重新發明輪子的，這裏有到已經這樣做了一個jQuery模塊的鏈接：https://github.com/ChrisWren/touch-input-nav

如果你想要一個純JS的解決方案，來看看：https://github.com/ChrisWren/touch-input-nav/blob/master/touch-input-nav.js 沒有那麼需要重寫的代碼應該不是問題。