[JQUERY] $ .focus () 작동하지 않습니다

$ .focus () 작동하지 않습니다

해결법

1. ---

   1.실제로 콘솔에 집중하지 않는 한이 사이트에 초점을 맞추기 위해 주어진 예제는 잘 작동합니다. 작동하지 않는 이유는 단순히 Dev 콘솔에서 초점을 훔치지 않기 때문에 단순히 일 것입니다. 콘솔에서 다음 코드를 실행 한 다음 브라우저 창을 빠르게 클릭하면 검색 상자에 초점이 맞 춥니 다.

   실제로 콘솔에 집중하지 않는 한이 사이트에 초점을 맞추기 위해 주어진 예제는 잘 작동합니다. 작동하지 않는 이유는 단순히 Dev 콘솔에서 초점을 훔치지 않기 때문에 단순히 일 것입니다. 콘솔에서 다음 코드를 실행 한 다음 브라우저 창을 빠르게 클릭하면 검색 상자에 초점이 맞 춥니 다.

   setTimeout(function() { $('input[name="q"]').focus() }, 3000);
   

   다른 사람은 과거에 문제가 발생한 한 가지는 사건의 질서입니다. DOM에 첨부되지 않은 요소에서 초점 ()을 호출 할 수 없습니다. 이미 포커스가있는 요소가 이미 DOM에 첨부 되었습니까?

2. ---

   2.그물의 다른 곳에서 해결책을 발견 ...

   그물의 다른 곳에서 해결책을 발견 ...

   $('#id').focus();
   

   작동하지 않았다.

   $('#id').get(0).focus();
   

   일 했어.

3. ---

   3.여기에서 답변 중 일부는 SetTimeout을 사용하여 대상 요소에 초점을 맞추는 프로세스를 지연시킵니다. 그 중 하나는 대상이 모달 대화 상자 안에있는 것을 언급합니다. 사용 된 위치의 특정 세부 사항을 알지 못하지 않으면 서 SetTimeOutSolution의 정확성에 대해 더 이상 언급 할 수 없습니다. 그러나, 나는 내가 한 것처럼이 스레드에 달리는 사람들을 돕기 위해 여기에 답변을 제공해야한다고 생각했다.

   여기에서 답변 중 일부는 SetTimeout을 사용하여 대상 요소에 초점을 맞추는 프로세스를 지연시킵니다. 그 중 하나는 대상이 모달 대화 상자 안에있는 것을 언급합니다. 사용 된 위치의 특정 세부 사항을 알지 못하지 않으면 서 SetTimeOutSolution의 정확성에 대해 더 이상 언급 할 수 없습니다. 그러나, 나는 내가 한 것처럼이 스레드에 달리는 사람들을 돕기 위해 여기에 답변을 제공해야한다고 생각했다.

   이 문제의 간단한 사실은 아직 표시되지 않는 요소에 집중할 수 없다는 것입니다. 이 문제를 해결하면 초점을 맞추기 위해 실제로 대상이 실제로 표시되는지 확인하십시오. 내 자신의 경우에 나는이 줄을 따라 뭔가를하고 있었다.

   $('#elementid').animate({left:0,duration:'slow'});
   $('#elementid').focus();
   

   이것은 일하지 않았다. 나는 $ ( '# ElementID'를 실행했을 때 어떤 일이 일어나고 있는지 깨달았습니다. 초점 ()`일을했던 콘솔에서. 차이점 - 대상 위의 내 코드에서 애니메이션이 완료되지 않기 때문에 대상이 고려 될 것이라는 확실성이 없습니다. 그리고 단서가 거짓말을합니다

   $('#elementid').animate({left:0,duration:'slow',complete:focusFunction});
   
   function focusFunction(){$('#elementid').focus();}
   

   예상대로 작동합니다. 나는 너무나 처음에 SetTimeout 솔루션을 넣었고 그것은 또한 일했습니다. 그러나 임의로 선택한 시간 초과는 대상 요소가 보장되는 프로세스에 대해 얼마나 천천히 호스트 장치가 얼마나 천천히 어떻게 진행되는지에 따라 솔루션을 더 빨리 파손 할 수 있습니다.

4. ---

   4.부트 스트랩 + 모달을 사용하는 경우 이것은 나를 위해 일했습니다 :

   부트 스트랩 + 모달을 사용하는 경우 이것은 나를 위해 일했습니다 :

     $(myModal).modal('toggle');
     $(myModal).on('shown.bs.modal', function() {
       $('#modalSearchBox').focus()
     });
   

5. ---

   5.다른 사람 이이 질문을 가로 지르는 다른 사람이 무슨 상황을 가졌습니다. 다른 요소를 클릭하면 초점을 설정하려고했지만 초점이 작동하지 않는 것으로 나타났습니다. 나는 방금 e.preventdefault ()가 필요하다는 것을 밝혀 냈습니다. - 예제가 있습니다.

   다른 사람 이이 질문을 가로 지르는 다른 사람이 무슨 상황을 가졌습니다. 다른 요소를 클릭하면 초점을 설정하려고했지만 초점이 작동하지 않는 것으로 나타났습니다. 나는 방금 e.preventdefault ()가 필요하다는 것을 밝혀 냈습니다. - 예제가 있습니다.

   $('#recipients ul li').mousedown(function(e) {
       // add recipient to list
       ...
       // focus back onto the input
       $('#message_recipient_input').focus();
       // prevent the focus from leaving
       e.preventDefault();
   });
   

   이것은 다음과 같이 도움이되었습니다.

6. ---

   6.나는 이것이 오래되었다는 것을 알고 있지만, 오늘 그것을 발견했다. 나에게 일한 답변 중 누구도, 내가 일하는 것이 발견 된 것을 발견 한 짓을 한 것들. SetTimeout 작업을 사용하여 모달의 입력을 제출 한 입력에 초점을 맞추기를 원했습니다. 도움이 되었기를 바랍니다!

   나는 이것이 오래되었다는 것을 알고 있지만, 오늘 그것을 발견했다. 나에게 일한 답변 중 누구도, 내가 일하는 것이 발견 된 것을 발견 한 짓을 한 것들. SetTimeout 작업을 사용하여 모달의 입력을 제출 한 입력에 초점을 맞추기를 원했습니다. 도움이 되었기를 바랍니다!

7. ---

   7.나는 또한이 문제가 있었다. 내 경우에 작업 한 솔루션은 HTML 요소의 tabIndex 속성을 사용하는 것이 었습니다.

   나는 또한이 문제가 있었다. 내 경우에 작업 한 솔루션은 HTML 요소의 tabIndex 속성을 사용하는 것이 었습니다.

   나는 목록 안에있는 일부 LI 요소에 NG-Repeat를 사용하고 있었고, 나는 .focus ()를 사용하여 첫 번째 LI에 집중할 수 없었기 때문에 루프 동안 각 LI에 tabIndex 속성을 추가하기 만하면됩니다.

   이제

8. +1은 인덱스가 0에서 시작되었습니다. 또한 .focus () 함수를 호출하기 전에 요소가 DOM에 있는지 확인하십시오.

   이게 도움이 되길 바란다.

9. ---

   8."$ (요소) .show ()"를 사용했기 때문에 작동하지 않는 문제가있는 것들을 위해. 나는 다음 방식으로 그것을 해결했다.

   "$ (요소) .show ()"를 사용했기 때문에 작동하지 않는 문제가있는 것들을 위해. 나는 다음 방식으로 그것을 해결했다.

    var textbox = $("#otherOption");
    textbox.show("fast", function () {
       textbox[0].focus();
     });
   

   따라서 쇼 메소드가 완료된 후에는 타이머가 필요하지 않습니다.

10. ---

    9.Focus () 전에 지연을 추가하십시오. 200ms가 충분합니다

    Focus () 전에 지연을 추가하십시오. 200ms가 충분합니다

    function focusAndCursor(selector){
      var input = $(selector);
      setTimeout(function() {
        // this focus on last character if input isn't empty
        tmp = input.val(); input.focus().val("").blur().focus().val(tmp);
      }, 200);
    }
    

11. ---

    10.지금이 문제를 다시 한 번 믿고, 내가해야 할 일은 모두 개발자 도구를 닫았습니다. 분명히 콘솔 탭에는 페이지 내용에 초점 우선 순위가 있습니다.

    지금이 문제를 다시 한 번 믿고, 내가해야 할 일은 모두 개발자 도구를 닫았습니다. 분명히 콘솔 탭에는 페이지 내용에 초점 우선 순위가 있습니다.

12. ---

    11.요소와 부모가 보이는지 확인하십시오. 숨겨진 요소에 초점을 맞출 수 없습니다

    요소와 부모가 보이는지 확인하십시오. 숨겨진 요소에 초점을 맞출 수 없습니다

13. ---

    12.추가 솔루션에는 집중 ()이 작동하지 않지만 결국 필요한 것이 올바른 위치로 스크롤되었음을 밝혀졌습니다.

    추가 솔루션에는 집중 ()이 작동하지 않지만 결국 필요한 것이 올바른 위치로 스크롤되었음을 밝혀졌습니다.

14. ---

    13.내 경우에 탭 색인을 지정해야합니다 (스크립트를 통해 초점을 맞출 수있는 경우 -1).

    내 경우에 탭 색인을 지정해야합니다 (스크립트를 통해 초점을 맞출 수있는 경우 -1).

    <div tabindex='-1'>
    <!-- ... -->
    </div>
    

from https://stackoverflow.com/questions/15859113/focus-not-working by cc-by-sa and MIT license