layer弹窗在IOS上，被软键盘挤到上边的解决方法

就像这种情况，经过多番请教跟尝试，找到一个能解决这个问题的方法，但可能有点笨重。就是在当前弹框里，设置offset的值，里边的值可以随意写，然后再下边给弹框追加一个样式即可。

<!DOCTYPE html>
<html><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" /><meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" /><meta name="renderer" content="webkit"><title>解决iOS，layer弹框被软键盘挤上去的问题</title><meta name="description" content="" /><meta name="keywords" content="" /><meta name="robots" content="index,follow" /><!-- 搜索引擎抓取 --><meta name="apple-mobile-web-app-capable" content="yes"><meta name="apple-mobile-web-app-status-bar-style" content="black"><meta name="x5-fullscreen" content="true"><meta name="full-screen" content="yes"><meta name="screen-orientation" content="portrait"><link rel="stylesheet" type="text/css" href="css/reset.css" /><link rel="stylesheet" href="https://img.huiyiguanjia.com/CDNFile/bootstrap/bootstrap-3.3.7.min.css"><script src="https://img.huiyiguanjia.com/CDNFile/jquery/jquery-2.1.2.min.js"></script><script src="https://img.huiyiguanjia.com/CDNFile/layer/layer-v3.1.1/layer/layer.js"></script>
s</head><body><div class="main"><div class="dataDownload"><style type="text/css">input{margin:20px 0;border-style: none;border: 1px solid blue;width: 100%;}textarea{width:100%}/* .layui-layer-dialog{left: 50%!important;top: 60%;} */</style><input type="text" id="test"><input type="text" id="test"><input type="text" id="test"><input type="text" id="test"><input type="text" id="test"><input type="text" id="test"><input type="text" id="test"><input type="text" id="test"><input type="text" id="test"><textarea rows="5" cols="100%"></textarea><input type="text" id="test"><input type="text" id="test"><input type="text" id="test"><input type="text" id="test"><input type="text" id="test"><input type="text" id="test"><input type="text" id="test"><input type="text" id="test"><textarea rows="5" cols="100%"></textarea><input type="text" id="test"><input type="text" id="test"><input type="text" id="test"><input type="text" id="test"><input type="text" id="test"><input type="text" id="test"><input type="text" id="test"></div></div></body>
</html>
<script type="text/javascript">$("input,textarea").focus(function() {if ($(this).val() == '') {layer.msg('Question 2 cannot be empty.', {icon: 7,offset:'heightBox',time: 1001000});$(".layui-layer-dialog").css("top","60%")return false;}});
</script>

转载于:https://www.cnblogs.com/fkcqwq/p/11549232.html

layer弹窗在IOS上，被软键盘挤到上边的解决方法相关推荐

EditText上关闭软键盘但保留闪烁游标的方法
今天碰到一个需求,在EditText获得焦点时不自动弹出软键盘,但是仍要保留闪烁的游标. 先在网上搜了下关闭软键盘,很多方法是这样的: InputMethodManager imm = (InputM ...
软键盘挡住WebView中输入框解决方法
如果是EditText,弹出软键盘好处理,会自动把输入框顶上来. 但如果输入框实在WebView中,那就不好处理了. 什么设置android:windowSoftInputMode属性啊,什么套一层S ...
Android的软键盘和主题冲突的解决方法
把布局的layout换成这个layout试一下问题描述..我们要做一个状态栏设置颜色(也就是和我们的主题色一致的效果).我把主题换成 noactionbar的主题了,然后就出现很多弹出软键盘的时候布 ...
android 软键盘遮住按钮,Android应用中出现软键盘遮挡住按钮如何解决
Android应用中出现软键盘遮挡住按钮如何解决发布时间:2020-11-20 16:25:47 来源:亿速云阅读:110 作者:Leah Android应用中出现软键盘遮挡住按钮如何解决?相信很 ...
css3软键盘不盖住输入框的方法
css3软键盘不盖住输入框的方法 .p1{ width:100%; height: auto; overflow: hidden; position: relative; } .width100{ w ...
在带有触控 ID 的妙控键盘上无法正常使用触控 ID的解决方法
如果您无法使用触控 ID 解锁 Mac.无法注册指纹,或者无法使用触控 ID 输入密码,那我们该怎么办呢?小编给大家带来了详细的解决方法,需要的朋友欢迎参考操作! 检查兼容性带有触控 ID 的妙控键 ...
Github上的版本和本地版本冲突的解决方法
Github上的版本和本地版本冲突的解决方法远程和本地版本冲突情景: 在github上创建项目,然后本地git init 然后没有git pull -f --all 然后git add . | ...
win10系统不认ps2键盘怎么办？圆口键盘win10系统无法使用的解决方法，亲测有效！！
win10系统不认ps2键盘怎么办?小编收到了某些用户的反应称自己的电脑在使用win7旗舰版系统的时候键盘是正常使用的,但是将系统升级到win10之后键盘就失灵了,该怎么办?在win10系统中出现了无 ...
layer重复弹出(layui弹层同时存在多个)的解决方法
layer重复弹出(layui弹层同时存在多个)的解决方法参考文章: (1)layer重复弹出(layui弹层同时存在多个)的解决方法 (2)https://www.cnblogs.com/sird ...

layer弹窗在IOS上，被软键盘挤到上边的解决方法

layer弹窗在IOS上，被软键盘挤到上边的解决方法相关推荐

最新文章

热门文章