我正在使用JQuery Mobile 1.4.5构建Web应用程序。我发现在Android（v.4.4.2）中使用Google Chrome主屏（全屏）模式时，肯定是浏览器或JQM错误。
当我点击
点击这里！！
可折叠标题，然后选择文本区域，将出现键盘，但由于它位于屏幕的下半部分，所以它隐藏了文本输入框。除非用户最小化键盘，否则这将阻止用户看到他们正在键入的内容以及按“提交”。
键盘打开时，应向上移动文本框，使其位于键盘上方，并且页面应可滚动。这是我预期的行为，在Chrome网络浏览器模式，iOS全屏和浏览器模式下会发生这种情况。
在工作回合中有什么想法吗？它使应用程序的某些部分无法使用！
<!DOCTYPE html>
<html>
<head>
<title>Test Page</title>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" >
<meta name='apple-mobile-web-app-capable' content='yes' />
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="apple-touch-icon" href="apple-touch-icon.png" />
<link rel="shortcut icon" href="apple-touch-icon.png" />
<link rel="apple-touch-icon-precomposed" href="apple-touch-icon.png"/>
<script src="./js/jquery.js"></script>
<script src="./js/jqm1.4.5/jquery.mobile-1.4.5.min.js"></script>
<link rel="stylesheet" href="./css/jqm1.4.5/jquery.mobile.external-png-1.4.5.min.css">
<link rel="stylesheet" href="./css/jqm1.4.5/jquery.mobile.inline-png-1.4.5.min.css">
<link rel="stylesheet" href="./css/jqm1.4.5/jquery.mobile.inline-svg-1.4.5.min.css">
<link rel="stylesheet" href="./css/jqm1.4.5/jquery.mobile-1.4.5.css">
<link rel="stylesheet" href="./css/jqm1.4.5/Theme.css">
<link rel="stylesheet" href="./css/jqm1.4.5/jquery.mobile.icons-1.4.5.min.css">
<link rel="stylesheet" href="./css/jqm1.4.5/jquery.mobile.structure-1.4.5.min.css">
</head>
<body>
<div data-role="page" id="index" data-theme="a" >
<style>
.ui-title {
margin: 0em 15% 0em !important;
}
</style>
<div data-role="header" data-theme="a" data-position="fixed" style="min-height: 40px;">
<a href="#navigation" style="margin-left: 3px; margin-bottom: 3px;" data-icon="bars" data-iconpos="notext">Navigation</a>
<h1 style="white-space:normal;">test</h1>
<a href="#search" style="margin-right: 3px; margin-bottom: 3px;" data-icon="search" data-iconpos="notext">Search</a>
</div><!-- /header -->
<div data-role="content">
<div data-role='collapsible-set' data-corners='false' >
<div data-role='collapsible' data-theme='b' data-collapsed='false'><h2>1</h2>
</div> <!-- collapsible end -->
<div data-role='collapsible' data-theme='b'><h2>2</h2>
</div> <!-- collapsible end -->
<div data-role='collapsible' data-theme='b'><h2>3</h2>
</div> <!-- collapsible end -->
<div data-role='collapsible' data-theme='b'><h2>4</h2>
</div> <!-- collapsible end -->
<div data-role='collapsible' data-theme='b'><h2>5</h2>
</div> <!-- collapsible end -->
<div data-role='collapsible' data-theme='b'><h2>6</h2>
</div><!-- collapsible end -->
<div data-role='collapsible' data-theme='b'><h2>7</h2>
</div><!-- collapsible end -->
<div data-role='collapsible' data-theme='b'>
<h2>Click Here!!</h2>
<form>
<textarea cols='40' rows='auto' style='height:100px;' name='newNotes' id='newNotes'></textarea>
<input type='submit' id='Submit' value='Update' class='ui-btn ui-btn-c ui-btn-inline' data-theme='c' data-transition='pop' />
</form>
</div><!-- collapsible end -->
</div> <!-- close collapsible set -->
</div><!-- /content -->
</div><!-- /page -->
</body>
最佳答案
这显然是Android上的持续问题。
https://github.com/jquery/jquery-mobile/issues/1079
该链接的答案是禁用页面的全屏模式。 （提及两次工作。）