2010-05-17 4 views
7

jquery에서 나는 <li> 요소를 순서가없는 목록에 추가했습니다.jquery는 동적 콘텐츠에 중점을 둡니까?

내가 새로 만든 <li>에 집중하는 방법은 무엇입니까?

다음 작업을 수행 할 경우

$("ul").append('<li><input type="text" value="Hi!"></li>'); 
$("li:last").focus(); //doesn't work because new <li> isn't in dom yet 

초점이 작동하지 않습니다, 위에서 언급 한 바와 같이.

나는 JQuery와 1.4.2을 알고는 동적 요소를 추가하는 이벤트 핸들러를로드 할 수있는 live() 이벤트 핸들러를 가지고,하지만 난 내가 잘못 모르겠어요 :

$(document).ready(function() { 

    $('li').live('load', function() { 
     alert("hi!"); 
     $("li:last").focus(); 
    }); 
}); 
+0

'input' 엘리먼트는 ** EMPTY ** 엘리먼트이며, 종료 태그는 없어야합니다. value 애트리뷰트에 'hi!'를 넣고 싶을 것이다. – Quentin

+0

@David, 감사합니다. 이것은 실제 코드가 아니지만 어쨌든 해결할 것입니다. – Alan

+0

조회수는 2,005 회이며 단일 upvote가 아닙니다. 좋은 시간. – Alan

답변

7

에만 설정할 수 있습니다 초점을 유지할 수있는 요소에 초점을 맞 춥니 다. 기본적으로 목록 항목은 할 수 없습니다. 첫 번째 예에 실패하는 이유는 당신이 초점을 유지하도록 설계 요소를 사용한다 일반적으로

(즉 append가 무엇이며 그것을 는 DOM에서이다)는 DOM에없는 때문이 아니라, (즉 를 입력 항목에 포커스를 설정하십시오 (목록 항목 아님). HTML5의 tabindex (아마도 0으로 설정)을 사용할 수도 있습니다 (이전 버전과의 호환성은 떨어지지 만 덜 논리적입니다).

onload은 목록 항목이 외부 콘텐츠를로드하지 않기 때문에 작동하지 않습니다.

+0

감사합니다. 이것은 효과가 있었다. – Alan

2

시도해 볼 수 있습니다 ($(YourElement).trigger("focus")).

0

이 글은 내가 알고있는 오래된 글이지만이 문제를 해결할 수있는 간단한 방법은 HTML에 텍스트 입력을 만들고 CSS에 "display : none;"을 설정하는 것입니다. LI의 클릭 이벤트에서이 입력에 포커스를두고 키 누르기 이벤트를 수신합니다.

나는 그것을 해냈다. 그것은 매력처럼 작동한다.

관련 문제