Có cách nào để kích hoạt phím TAB theo chương trình để di chuyển tiêu điểm đến phần tử có thể lấy tiêu điểm tiếp theo không?

Question

Tôi đang viết một bài kiểm tra đơn vị để kiểm tra thứ tự tab trên trang web của mình và tôi không thể tìm cách mô phỏng khóa của người dùng xuống của khóa TAB để tập trung vào phần tử có thể lấy tiêu điểm tiếp theo, mặc dù điều này có vẻ là một nhiệm vụ dễ dàng.

jQuery được phép trong khi giải pháp javascript thuần túy được ưu tiên. Bất kỳ loại trợ giúp nào đều được đánh giá cao.

// TODO 
 
function triggerTab() { 
 

 

 
} 
 

 
$("#btn-save").focus(); 
 
triggerTab(); 
 

 
// Expect the focus is on the cancel button now. 
 
console.log(document.activeElement.id);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<p> some text </p> 
 
<button id="btn-save"> save </button> 
 
<button id="btn-cancel> cancel </button>

T.B. Không thể chấp nhận gọi focus() trên phần tử có thể lấy nét tiếp theo, ngay cả khi bạn có thể viết mã để tìm ra phần tử có thể lấy tiêu điểm tiếp theo. Vì vậy, con đường này là KHÔNG những gì tôi muốn:

function getAllFocusables() { 
    ... 
} 

var focusables = getAllFocusables(), 
    index = focusables.indexOf(document.activeElement); 

$(focusables[index+1]).focus(); 

Answer 1

Bạn không thể mô phỏng một phím tab từ một trình duyệt tiêu chuẩn sử dụng Javascript.

Nếu bạn đang làm bài kiểm tra đơn vị của bạn sử dụng một trình duyệt không đầu, như phantomjs ví dụ, bạn có thể bắt chước tab chính

var webPage = require('webpage'); 
var page = webPage.create(); 

page.sendEvent('keypress', page.event.key.Tab);