使用 JS/jQuery 將 tabindex 附加到輸入標簽

Question

我正在嘗試為輸入字段設置 tabindex，但我無權訪問 HTML。

我們正在插入一個由第三方生成的表單。 此表單有兩個字段，郵政編碼和電子郵件地址，按順序排列。 我想使用 CSS 重新排列它們（無需修改源平台上的字段），因此電子郵件高於郵政編碼，但顯然這會擾亂標簽順序。

輸入分別具有 PostalCode 和 EmailAddress 的名稱屬性。 我對 JS 知之甚少，因此我試圖從 Internet 上的資源中將其拼湊在一起，但迄今為止沒有成功。

我已經嘗試了以下但它不起作用，我顯然無法弄清楚為什么或如何正確地做到這一點。

document.getElementsByName("EmailAddress")[0].setAttribute("tabIndex", "1");
document.getElementsByName("PostalCode")[0].setAttribute("tabIndex", "2");
document.getElementsByClass("at-submit")[0].setAttribute("tabIndex", "3");

Answer 1

這有效。

請注意，我只是增加了元素以獲得更高的索引。

 const displayTabIndex = (name, { tabIndex }) => console.log(`${name} - ${tabIndex}`); document.addEventListener('DOMContentLoaded', () => { const tel = document.querySelector('input[type="tel"'); const pCode = document.querySelector('input[name="PostalCode"]'); displayTabIndex('tel', tel); displayTabIndex('pCode', pCode); pCode.setAttribute('tabIndex', 3); displayTabIndex('tel', tel); displayTabIndex('pCode', pCode); });

 <form> <input type="tel" name="tel" tabindex="2"> <input type="text" name="PostalCode" tabindex="1"> </form>