ด้วยตัวเองdocument.activeElementยังคงสามารถคืนองค์ประกอบหากเอกสารไม่ได้รับการมุ่งเน้น (และไม่มีสิ่งใดในเอกสารที่มุ่งเน้น!)
คุณอาจต้องการพฤติกรรมนั้นหรืออาจไม่สำคัญ (เช่นภายในkeydownเหตุการณ์) แต่ถ้าคุณจำเป็นต้องรู้ว่ามีบางสิ่งที่ให้ความสำคัญจริง ๆ คุณสามารถตรวจสอบเพิ่มเติมdocument.hasFocus()ได้
nullต่อไปนี้จะทำให้คุณมีองค์ประกอบเน้นหากมีหนึ่งหรืออื่น ๆ
var focused_element = null;
if (
document.hasFocus() &&
document.activeElement !== document.body &&
document.activeElement !== document.documentElement
) {
focused_element = document.activeElement;
}
ในการตรวจสอบว่าองค์ประกอบเฉพาะมีโฟกัสหรือไม่มันง่ายกว่า:
var input_focused = document.activeElement === input && document.hasFocus();
หากต้องการตรวจสอบว่ามีอะไรโฟกัสหรือไม่มันซับซ้อนกว่าอีกครั้ง:
var anything_is_focused = (
document.hasFocus() &&
document.activeElement !== null &&
document.activeElement !== document.body &&
document.activeElement !== document.documentElement
);
ความทนทานหมายเหตุ : ในโค้ดที่ใช้ตรวจสอบdocument.bodyและdocument.documentElementเป็นเพราะเบราว์เซอร์บางตัวส่งคืนหนึ่งหรือnullเมื่อไม่มีสิ่งใดมุ่งเน้น
มันไม่บัญชีสำหรับถ้า<body>(หรืออาจ<html>) มีtabIndexแอตทริบิวต์และทำให้จริงอาจจะเน้น หากคุณกำลังเขียนห้องสมุดหรือบางสิ่งบางอย่างและต้องการให้มันมีประสิทธิภาพคุณควรจัดการกับสิ่งนั้น
ต่อไปนี้เป็น ( หนัก airquotes) "หนึ่งซับ" รุ่นได้รับองค์ประกอบที่มุ่งเน้นซึ่งเป็นแนวคิดที่ซับซ้อนมากขึ้นเพราะคุณมีความรู้เกี่ยวกับการลัดวงจรและ y รู้มันเห็นได้ชัดว่าไม่พอดีในหนึ่งบรรทัดสมมติว่าคุณ ต้องการให้สามารถอ่านได้
ฉันจะไม่แนะนำอันนี้ แต่ถ้าคุณเป็น 1337 hax0r, idk ... มันอยู่ตรงนั้น
คุณสามารถถอดชิ้น|| nullส่วนออกได้ถ้าคุณไม่สนใจที่จะรับfalseในบางกรณี (คุณยังสามารถได้รับnullถ้าdocument.activeElementเป็นnull):
var focused_element = (
document.hasFocus() &&
document.activeElement !== document.body &&
document.activeElement !== document.documentElement &&
document.activeElement
) || null;
สำหรับการตรวจสอบว่าองค์ประกอบเฉพาะเจาะจงหรือคุณสามารถใช้เหตุการณ์ได้ แต่วิธีนี้ต้องมีการตั้งค่า (และอาจทำให้เกิดการฉีกขาด) และที่สำคัญถือว่าสถานะเริ่มต้น :
var input_focused = false;
input.addEventListener("focus", function() {
input_focused = true;
});
input.addEventListener("blur", function() {
input_focused = false;
});
คุณสามารถแก้ไขข้อสมมติสถานะเริ่มต้นได้โดยใช้วิธีที่ไม่มีเหตุการณ์ แต่คุณอาจใช้วิธีนั้นแทนก็ได้