我有一个jquery-mobile(1.3.1)+ phonegap应用程序,其中使用了弹出窗口小部件(此应用程序适用于Android-任何vresion)。该弹出窗口用于登录(它具有用户名,密码和“登录”按钮。每当我单击文本字段(用户名或密码)时,设备键盘都会弹出,但与弹出窗口重叠。在这种重叠的情况下,除非最小化键盘,否则用户看不到他们在键入的内容,也无法单击“登录”。这是我现在拥有的代码-我已经使用过“ data-position-to="window
”
<a href="#popupLogin" data-rel="popup" data-position-to="window" data-role="button" data-inline="true" data-icon="check" data-theme="a" data-transition="pop">Done</a>
<div data-role="popup" id="popupMenu" data-theme="a" >
<div data-role="popup" id="popupLogin" data-overlay-theme="e" data-theme="a" class="ui-corner-all">
<form>
<div style="padding:10px 20px;" data-overlay-theme="b">
<h3>Please sign in</h3>
<label for="ppcOpremarks" class="ui-hidden-accessible">Remarks</label>
<textarea name="ppcOpremarks" id="ppcOpremarks" value="" placeholder="Remarks (if any)" data-theme="a" ></textarea>
<label for="un" class="ui-hidden-accessible">Username</label>
<input name="user" id="un" value="" placeholder="username" data-theme="a" type="text">
<label for="pw" class="ui-hidden-accessible">Password</label>
<input name="pass" id="pw" value="" placeholder="password" data-theme="a" type="password">
<a href="#menuPage">
<button type="submit" data-theme="a" data-icon="check" id="ppCheckDone" onClick="updateppc()">Sign-In</button>
</a> </div>
</form>
</div>
</div>
如何使弹出窗口向上移动而不与设备键盘重叠?
最佳答案
将输入字段放在其中后,便可以reposition
弹出窗口。
$("#popupLogin input, #popupLogin textarea").on("focus", function () {
$("#popupLogin").popup("reposition", {
y: 0 /* move it to top */
});
});
Demo
关于android - 设备的(android)键盘处于 Activity 状态时,jQuery移动弹出窗口小部件不会移动,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/20784356/