`` 요소에 JavaScript의 'focus()' 기능을 사용할 수 있나요?
- DDD원래의
- 2024-11-05 04:50:02544검색
JavaScript를 사용하는 요소
질문:
JavaScript focus() 함수가 있는 요소?
배경:
요소가 사용 중입니다:
<code class="html"><div id="tries">You have 3 tries left</div></code>
그리고 이
요소에 초점을 맞추려는 시도가 이루어졌습니다. 코드를 사용하면:
<code class="javascript">document.getElementById('tries').focus();</code>
그러나 포커스가 적용되지 않습니다.
답변:
예, 포커스가 가능합니다.
focus() 함수를 사용하는 요소입니다. 핵심 단계는 에 tabindex 속성을 할당하는 것입니다.
<code class="html"><div tabindex="0">You have 3 tries left</div></code>
tabindex 0은 페이지의 자연스러운 탭 순서 내에 태그를 배치합니다. 숫자가 높을수록 1이 첫 번째, 2가 두 번째 등 특정 우선순위가 지정됩니다.
또한 tabindex가 -1이면
사용자 작업이 아닌 스크립트를 통해서만 초점을 맞출 수 있습니다.
다음은 이를 설명하는 코드 예제입니다.
<code class="javascript">document.getElementById('tries').onclick = function () {
document.getElementById('scripted').focus();
};</code>
<code class="css">div:focus {
background-color: Aqua;
}</code>
<code class="html"><div>Element X (not focusable)</div>
<div tabindex="0">Element Y (user or script focusable)</div>
<div tabindex="-1" id="scripted">Element Z (script-only focusable)</div>
<div id="test">Set Focus To Element Z</div></code>
위 내용은 `` 요소에 JavaScript의 'focus()' 기능을 사용할 수 있나요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!
성명：본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
질문:
JavaScript focus() 함수가 있는 요소?
배경:
요소가 사용 중입니다:
<code class="html"><div id="tries">You have 3 tries left</div></code>
그리고 이
요소에 초점을 맞추려는 시도가 이루어졌습니다. 코드를 사용하면:
<code class="javascript">document.getElementById('tries').focus();</code>
그러나 포커스가 적용되지 않습니다.
답변:
예, 포커스가 가능합니다.
focus() 함수를 사용하는 요소입니다. 핵심 단계는
에 tabindex 속성을 할당하는 것입니다.
<code class="html"><div tabindex="0">You have 3 tries left</div></code>
tabindex 0은 페이지의 자연스러운 탭 순서 내에 태그를 배치합니다. 숫자가 높을수록 1이 첫 번째, 2가 두 번째 등 특정 우선순위가 지정됩니다.
또한 tabindex가 -1이면
사용자 작업이 아닌 스크립트를 통해서만 초점을 맞출 수 있습니다.
다음은 이를 설명하는 코드 예제입니다.
<code class="javascript">document.getElementById('tries').onclick = function () {
document.getElementById('scripted').focus();
};</code>
<code class="css">div:focus {
background-color: Aqua;
}</code>
<code class="html"><div>Element X (not focusable)</div> <div tabindex="0">Element Y (user or script focusable)</div> <div tabindex="-1" id="scripted">Element Z (script-only focusable)</div> <div id="test">Set Focus To Element Z</div></code>
위 내용은 `` 요소에 JavaScript의 'focus()' 기능을 사용할 수 있나요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!
성명：
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.