programing

Element ID에 포커스가 있는지 확인하려면 어떻게 해야 합니까?

yellowcard 2023. 10. 7. 09:47
반응형

Element ID에 포커스가 있는지 확인하려면 어떻게 해야 합니까?

특정 조건이 충족된 후 초점을 맞추는 다음과 같은 디바가 있다고 가정해 보겠습니다.

<div id="myID" tabindex="-1" >Some Text</div>

해당 div에 포커스가 있는지 확인하는 핸들러를 만들고 div에 true/focus가 있다고 평가되면 다음과 같이 작업을 수행합니다(아래 예에서 콘솔 로그 인쇄).

if (document.getElementById('#myID').hasFocus()) {
            $(document).keydown(function(event) {
                if (event.which === 40) {
                    console.log('keydown pressed')
                }
            });
        }

콘솔에 다음과 같은 오류 메시지가 표시됩니다.

TypeError: null의 'hasFocus' 속성을 읽을 수 없습니다.

내가 여기서 뭘 잘못하고 있는지 알아요?어쩌면 내가 디바이드를 통과하는 방식?

포커스를 확인하려는 요소와 비교합니다.같은 경우에는 요소에 초점이 맞춰지고 그렇지 않으면 그렇지 않습니다.

// dummy element
var dummyEl = document.getElementById('myID');

// check for focus
var isFocused = (document.activeElement === dummyEl);

hasFocus 의 일부입니다.document; DOM 요소에 대해서는 그런 메서드가 없습니다.

또한.document.getElementByIda를 사용하지 않습니다.#초입에myID. 변경 내용:

var dummyEl = document.getElementById('#myID');

다음 항목에 대해:

var dummyEl = document.getElementById('myID');

CSS 쿼리를 대신 사용하려면 (및 )을 사용할 수 있습니다.

사용하다document.activeElement

효과가 있을 겁니다.

추신getElementById("myID")것은 아니다.getElementById("#myID")

jquery를 사용하려면$("..").is(":focus").

스택을 보시면 됩니다.

블록 요소이므로 포커스를 수신하려면 다음을 추가해야 합니다.tabindex에 있는 것과 같이 그것에 귀속합니다.

<div id="myID" tabindex="1"></div>

탭 인덱스를 사용하면 이 요소가 포커스를 받을 수 있습니다.tabindex="-1"(아니면 실제로 속성을 모두 제거하십시오) 이 동작을 허용하지 않습니다.

그리고 나서 당신은 간단하게

if ($("#myID").is(":focus")) {...}

또는 사용.

$(document.activeElement)

앞에서 제시한 바와 같이.

아래 코드를 스크립트로 작성하고 jQuery 라이브러리도 추가합니다.

var getElement = document.getElementById('myID');

if (document.activeElement === getElement) {
        $(document).keydown(function(event) {
            if (event.which === 40) {
                console.log('keydown pressed')
            }
        });
    }

감사합니다...

언급URL : https://stackoverflow.com/questions/36430561/how-can-i-check-if-my-element-id-has-focus

반응형