问题
I am using html5/javascript/jQuery/css for mobile app development. I have multiple textareas in the app. When I click on that to input, keyboard popup (android tab). But the textarea stays where it's on that page. How can I scroll page when keyboard pops up.
回答1:
with jQuery, get the textarea's offset().top value then set document scroll position using scrollTop()
var $htmlOrBody = $('html, body'), // scrollTop works on <body> for some browsers, <html> for others
scrollTopPadding = 8;
$('textarea').focus(function() {
// get textarea's offset top position
var textareaTop = $(this).offset().top;
// scroll to the textarea
$htmlOrBody.scrollTop(textareaTop - scrollTopPadding);
});
jsfiddle example
回答2:
To complete the answer, if you want to animate the scroll replace:
$htmlOrBody.scrollTop(textareaTop - scrollTopPadding);
by
var timing = 250;
$htmlOrBody.animate({ scrollTop: textareaTop - scrollTopPadding }, timing);
来源:https://stackoverflow.com/questions/18450659/scroll-textfield-up-when-keyboard-popsup