jQuery 모바일에서 포커스가있는 요소로 스크롤

Question

jQuery 모바일 팝업 위젯을 사용하는 jQuery 모바일 사이트에서 작업하고 있습니다. 내 팝업 안에 여러 양식 요소가 있습니다. 내용이 화면에 맞지 않으면 y 축을 스크롤하도록 팝업을 구성했습니다.

내가 겪고있는 문제는 사용자가 모바일 장치에있을 때 팝업의 아래쪽으로 양식 요소를 선택하면 네이티브 키보드가 사용자가 방금 선택한 양식 요소를 자르는 경우입니다.

사용자가 요소를 다시 수동으로 스크롤 할 수 있다는 것을 알았지 만 사용자에게 더 나은 환경을 제공하고자합니다. 이 문제를 해결하기 위해 생각할 수있는 유일한 방법은 사용자가 요소를 포커스에 가져 오면 프로그래밍 방식으로 각 양식 요소로 스크롤하는 것입니다. 아래 코드는 내가 작업 해 왔지만, 작동시키지 못한다. 여기

Uncaught TypeError: Cannot read property 'top' of undefined

내가 코드를 사용하고 있습니다 :

는

$('#popup input, #popup textarea').focusin(function() { 
    var container = $('#popup'), 
    scrollTo = $(this); 

    container.scrollTop(
     scrollTo.offset().top - container.offset().top + container.scrollTop() 
    ); 
}); 

사람이에 대한 해결책을 알고 있나요 내 콘솔 로그는 다음과 같은 오류를 보여주는 유지?

Answer 1

잘못된 대상을 사용하고있었습니다. 내 원래 코드는 $(this)이고 그 대신 $(e.target)을 사용해야합니다.

$('#popup input, #popup textarea').focusin(function(e) { 
     var container = $('#popup'), 
     scrollTo = $(e.target); 

     container.animate({ 
      scrollTop: scrollTo.offset().top 
     }, 300);  
}); 

이 코드는 일부만 작동했습니다. 키보드가 튀어 나올 때 올바른 오프셋을 캡처하기 위해 윈도우 크기 조정 이벤트에서 동일한 코드를 사용해야했습니다.