首页 > mui ios中form表单中点击输入框头部导航栏被推起及ios中form表单中同时存在日期选择及输入框时,日历选择页面错乱bug...

mui ios中form表单中点击输入框头部导航栏被推起及ios中form表单中同时存在日期选择及输入框时,日历选择页面错乱bug...

 一、ios header导航栏被推起解决方法

1 设置弹出软键盘时自动改变webview的高度

plus.webview.currentWebview().setStyle({  softinputMode: "adjustResize"  // 弹出软键盘时自动改变webview的高度  
});  

2 增加样式

html, body {   height: 100%;  margin: 0px;  padding: 0px;  overflow: hidden;  -webkit-touch-callout: none;  -webkit-user-select: none;  
}  .mui-content {   height: 100%;  overflow: auto;   
}  

 二、ios中点击日历插件后点击input页面错乱、日历插件被掉起解决方法

ios 中input软键盘和dtpicker日历插件页面错乱

ios中软键盘和dtpicker日历插件错乱

 

解决方法

首先用现在最新的demo的最新引入的picker的插件 js,然后在mui.picker.min.js文件里面添加了俩句话a.dispose();,如下代码:,e.DtPicker = e.Class.extend({
init: function(n) {
var a = this,
r = e.dom(i)[0];
t.body.appendChild(r), e('[data-id="picker"]', r).picker();
var s = a.ui = {
picker: r,
mask: e.createMask(),
ok: e('[data-id="btn-ok"]', r)[0],
cancel: e('[data-id="btn-cancel"]', r)[0],
y: e('[data-id="picker-y"]', r)[0],
m: e('[data-id="picker-m"]', r)[0],
d: e('[data-id="picker-d"]', r)[0],
h: e('[data-id="picker-h"]', r)[0],
i: e('[data-id="picker-i"]', r)[0],
labels: e('[data-id="title-"]', r)
};
s.cancel.addEventListener("tap", function() {
a.hide();
a.dispose();//自己加的 。ios点击取消按钮后,再弹出软键盘的时候,会弹出日历选择器,所以要释放日历选择器
}, !1), s.ok.addEventListener("tap", function() {
var e = a.callback(a.getSelected());
e !== !1 && a.hide()
}, !1), s.y.addEventListener("change", function(e) {
a.options.beginMonth || a.options.endMonth ? a._createMonth() : a._createDay()
}, !1), s.m.addEventListener("change", function(e) {
a._createDay()
}, !1), s.d.addEventListener("change", function(e) {
(a.options.beginMonth || a.options.endMonth) && a._createHours()
}, !1), s.h.addEventListener("change", function(e) {
(a.options.beginMonth || a.options.endMonth) && a._createMinutes()
}, !1), s.mask[0].addEventListener("tap", function() {
a.hide();
a.dispose();//自己加的。ios点击取消按钮后,再弹出软键盘的时候,会弹出日历选择器,所以要释放日历选择器
}, !1), a._create(n), a.ui.picker.addEventListener(e.EVENT_START, function(e) {
e.preventDefault()
}, !1), a.ui.picker.addEventListener(e.EVENT_MOVE, function(e) {
e.preventDefault()
}, !1)
},

 

转载于:https://www.cnblogs.com/aishangliming/p/10884689.html

更多相关:

  •   /*禁止缩放safari浏览器*/ var scale = {disabledSafari: function () {/* 阻止双击放大*/var lastTouchEnd = 0;document.addEventListener("touchstart", function (event) {if (event.touch...

  •   $g.$utils = {/**舒工Ajax-lite 1.0 -- 最精简的ajax自定义访问方法*/ajax: function (o) {var p = o.post, g = o.get, d = p.data, a = p.async, J = 'json', j = p[J], s = g.success, e =...

  •   Sg.js框架核心概念: 1)所有变量、方法、类对象全部都是从属于$g主树,由$g分支出很多$g.变量名、$g.方法、$g.对象id、$g.类;2)获取控件内部属性必须使用公开的get方法获取,禁止直接用访问内部变量方式来获取控件内部变量、属性值;3)修改控件内部属性、绑定方法等都必须使用公开的set方法来操作,禁止直接用访问...

  • 前端发送Ajax请求到服务器,服务器返回数据这一过程,因原因不同耗时长短也有差别,且这段时间内页面显示空白。如何优化这段时间内的交互体验,以及长时间内服务器仍未返回数据这一问题,是我们开发中不容忽视的重点。 常见的做法是: 1、设置超时时间,一旦时间超过设定值,便终止请求;2、页面内容加载之前,手动增加一个 loading 层。 代码...