동적으로로드 된 DIV의 필드에 포커스 설정

Question

동적으로로드되는 DIV의 특정 필드에 포커스를 설정하는 적절한 방법은 무엇입니까?

$("#display").load("?control=msgs"); // loads the HTML into the DIV 
$('#display').fadeIn("fast"); // display it 
$("tex#header").focus();   // ?? neither that 
$("input#header").focus();  // ?? nor that 
$('#display', '#header').focus() // ?? nor that 
$("#header").focus();    // ?? nor that works 

다음 HTML은 display DIV로 가져올 수 있습니다 :

<div id="display"> 
<form id="newHeaderForm" class="dataform" action="/" method="post"> 
    <input id="to" type="hidden" value="22" name="to"/> 
    <dl> 
     <dt>Header</dt> 
     <dd> 
      <input id="header" class="large" type="text" name="header" value="" maxlength="128"/> 
     </dd> 
</form> 
</div> 

많은, 많은 감사합니다!

Answer 1

load() 함수는 비동기 함수입니다. #header가 참조하는 요소가 아직 존재하지 않으므로 load() 호출이 완료된 후에 load()의 콜백 함수에 포커스를 설정해야합니다. 예를 들어 :

$("#display").load("?control=msgs", {}, function() { 
    $('#header').focus(); 
}); 

나 자신도이 솔루션에 문제가 있었다, 그래서 나는 콜백에서의 setTimeout을했고 요소가 존재 정말/확인/확인하기 위해 시간 제한에 초점을 설정합니다.

Answer 2

Id로 간단히 선택해 보셨습니까?

$("#header").focus(); 

IDS로 보는 것은 고유해야는보다 구체적인 선택을 할 필요가 없습니다.

Answer 3

$("#header").focus(); 

후 작동하지 않는 헤더의 ID를 사용하여 페이지의 다른 요소가 있다면?

firebug를 사용하여 $("#header")을 실행하고 반환되는 내용을 확인하십시오.

Answer 4

동적으로 추가 된 항목을 DOM에 추가해야합니다 ... clone().append()은 DOM에 추가하여 jquery를 통해 항목을 선택할 수 있도록합니다.

Answer 5

$("#display").load("?control=msgs", {}, function() { 
    $('#header').focus(); 
}); 

시도했지만 작동하지 않습니다.이 문제를 해결하기 위해 더 많은 조언을주십시오. 당신의 도움을 주셔서 감사합니다

Answer 6

예, 이것은 아직 존재하지 않는 요소를 조작 할 때 발생합니다 (여기에 약간의 공헌자도 고유 ID와 함께 좋은 점을 남겼습니다). 비슷한 문제가 발생했습니다. 곧 렌더링 될 요소를 조작하는 함수에 인수를 전달해야합니다.

여기서 해결 된 해결책은 도움이되지 않았습니다. 마지막으로 상자에서 바로 작동하는 것을 찾았습니다. 그리고 그것은 너무 예쁘다.

대신에 :

$('#header').focus(); 
or the tempting: 
setTimeout($('#header').focus(), 500); 

이 시도 :

setTimeout(function() { $('#header').focus() }, 500); 

을 내 코드에서 인수를 전달하는 시험이 작동하지 않았다, 제한 시간은 무시 :

setTimeout(alert('Hello, '+name), 1000); 

이 작업은 시간 초과 틱 :

setTimeout(function() { alert('Hello, '+name) }, 1000); 

w3schools는 그것을 언급하지 않습니다.

크레딧 : makemineatriple.com.

이 정보가 도움이되기를 바랍니다.

Martas

Answer 7

OMU가 지적한 것처럼, 당신이 문서 준비 기능에 초점을 설정해야합니다. jQuery가 그것을 제공한다. 그리고 ID를 선택하십시오. 예를 들어, 로그인 페이지가있는 경우 :

$(function() { $("#login-user-name").focus(); }); // jQuery rocks! 

Answer 8

이것은 페이지로드시 실행됩니다. U가 prorepty 또는 기능을 설정하는 것은 잘못 객체를 사용하기 때문에

<script type="text/javascript"> 
    $(function() { 
     $("#header").focus(); 
    }); 
</script> 

Answer 9

$("#header").attr('tabindex', -1).focus(); 

Answer 10

$(function(){ 
    $('body').on('keypress','.sobitie_snses input',function(e){ 
     if(e.keyCode==13){ 
      $(this).blur(); 
      var new_fild = $(this).clone().val(''); 
      $(this).parent().append(new_fild); 
      $(new_fild).focus(); 
     } 
    }); 
}); 

오류의 대부분이다. console.log (new_fild)를 사용하십시오. 무슨 객체 U가 prorepty 또는 기능을 설정하려고 하는지를 봅니다.