Xóa hoặc vô hiệu hóa đường viền tiêu điểm của trình duyệt qua javascript

Question

Có ai biết cách vô hiệu hóa hoặc thao tác đường viền gạch ngang (trong hầu hết các trình duyệt) của phần tử dom nếu nó có trọng tâm theo thứ tự tabindex không?

Tôi muốn xây dựng phong cách riêng của mình cho một yếu tố tập trung, nhưng sẽ rất tuyệt khi sử dụng tính năng hiện có, vì với tabindex, bạn có thể liên kết sự kiện keydown với phần tử dom.

Answer 1

Chỉ cần tạo ra một quy tắc CSS cho các yếu tố bạn muốn có outline:none;

Answer 2

Sử dụng jQuery bạn có thể làm

$("#nav li a").focus(function(){ 
    $(this).blur(); 
}); 

Answer 3

input::-moz-focus-inner { border: 0; } 

Answer 4

CSS lừa:

:focus { outline: none; } 

Answer 5

a { 
outline: 0; 
} 

a: hover, 
a: active, 
a: focus { 
    outline: none; 
} 

input::-moz-focus-inner { 
border: 0; 
} 

Answer 6

:focus state - Bộ outline property đến 0px trong suốt;

Answer 7

Với Firefox 53.0, nếu tôi tắt đường viền bằng một trong các giải pháp được đề xuất, Firefox sẽ hiển thị giải pháp mặc định.

Tuy nhiên, nếu tôi sử dụng một màu trắng, nó không phát hiện ra rằng những phác thảo được ẩn:

input:focus{ 
    outline: 1px solid rgba(255,255,255,1); 
}