j***@163.com
j***@163.com
  • 发布:2019-10-24 11:33
  • 更新:2020-12-01 14:39
  • 阅读:1352

【报Bug】【报Bug】ios 13.1 input 不收起键盘切换,会回复置顶遮挡输入框

分类:5+ SDK

详细问题描述

(DCloud产品不会有明显的bug,所以你遇到的问题大都是在特定环境下才能重现的问题,请仔细描述你的环境和重现方式,否则DCloud很难排查解决你的问题)

[内容]

  
<!DOCTYPE html>  
<html>  
  
	<head>  
		<meta charset="utf-8">  
		<title>AgentEntry</title>  
		<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">  
		<meta name="apple-mobile-web-app-capable" content="yes">  
		<meta name="apple-mobile-web-app-status-bar-style" content="black">  
  
		<link rel="stylesheet" href="../css/mui.min.css">  
		<link rel="stylesheet" type="text/css" href="../css/mui.poppicker.css" />  
		<link rel="stylesheet" type="text/css" href="../css/mui.picker.min.css" />  
		<link rel="stylesheet" type="text/css" href="../css/app.css" />  
		<!-- <link rel="stylesheet" type="text/css" href="../css/account.css" /> -->  
		<style>  
			body {  
				background-color: rgb(238,234,243);  
			}  
			.mui-input-group{  
				padding:1rem;  
			}  
			.mui-input-group .mui-input-row::after{  
				height: 0rem;  
			}  
			  
			.mui-input-group .mui-input-row {  
			    height: auto;  
				background-color: rgb(242,242,247);  
				/* opacity: 0.5; */  
				margin-bottom: 1rem;  
				border-radius: 0.25rem;  
			}  
			input[type="tel"], input[type="text"],input[type="number"]{  
				background-color: transparent;  
				border: none;  
				font-size: 1rem;  
			}  
			.mui-input-row h5{  
				margin-left: 1rem;  
				margin-top: 14px;  
				color: #323133;  
				font-size: 0.75rem;  
				margin-bottom: 0rem;  
			}  
			.mui-btn h5{  
				/* margin-left: 1rem; */  
				/* margin-top: 14px; */  
				color: #323133;  
				font-size: 0.75rem;  
				/* margin-bottom: 0rem; */  
			}  
			#time_img {  
			    width: 12px;  
			    height: auto;  
				margin-top: 6px;  
			    /* margin-top: 6px; */  
			}  
			.mui-input-row .mui-input-clear ~ .mui-icon-clear, .mui-input-row .mui-input-password ~ .mui-icon-eye, .mui-input-row .mui-input-speech ~ .mui-icon-speech {  
			    top: 35px;  
			    right: 50px;    
			}  
		</style>  
	</head>  
  
	<body>  
  
		<header id="header" class="mui-bar mui-bar-nav bg-blue">  
				<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left color-fff"></a>  
			<h1 id="title" class="mui-title color-fff">发展下级</h1>  
		</header>  
  
		<div id='contentMui' class="mui-content bg-fff mui-scroll-wrapper">  
		  	<div class="mui-scroll">  
		  		<!--这里放置真实显示的DOM内容-->  
		    
		    
			<!-- <form action="" id="login-form" style="padding: 1rem;">  
				<div class="form-bg">  
					<div id="u" class="form-group">  
						<input id="partnerName"  class="form-control"  type="text" required="required" placeholder="请输入代理商名称" maxlength="30">  
						  
						<label for="partnerName" class="float-label">代理商名称</label>  
  
					</div>  
				</div>  
  
				<div class="form-bg">  
  
					<div id="p" class="form-group" style="width: 88%;display: inline-block;">  
						<input id="identityNo" class="form-control"  type="tel" maxlength="18"   
						 required="required" placeholder="请输入身份证号">  
  
						<label for="identityNo" class="float-label">身份证号</label>  
					</div>  
					<a id="frontNo"><img src="../images/agent/scan.png" style="height: 1.458125rem;width: 1.5rem;vertical-align: middle;"></a>  
				</div>  
  
				<div class="form-bg">  
					<div id="u" class="form-group">  
						<input id="mobile"  class="form-control"  type="tel"   
						 required="required" placeholder="请输入联系电话" maxlength="30">  
						  
						<label for="mobile" class="float-label">联系电话</label>  
  
					</div>  
				</div>  
				<div class="form-bg">  
					<div id="u" class="form-group">  
						<input id="email"  class="form-control"  type="text"   
						 required="required" placeholder="请输入电子邮箱" maxlength="30">  
					  
						<label for="email" class="float-label">电子邮箱</label>  
  
					</div>  
				</div>  
  
				<div class="form-button-bg">  
					<h5 style="padding-left: 1rem;font-size: 0.75rem;">地区</h5>  
  
					<button id="address" type="button" class="mui-btn mui-btn-block mui-text-left" style="padding: 0rem 1rem;border: none;background-color: transparent;font-size: 1rem;color: #B8B7BD;">请选择地区<img  
						 class="mui-pull-right" id="time_img" src="../images/drop_down.png" /></button>  
				</div>  
				<div class="form-bg">  
					<div id="u" class="form-group">  
						<input id="detail"  class="form-control" name="detail" type="text"   
						 required="required" placeholder="请输入联系地址" maxlength="50">  
						  
						<label for="detail" class="float-label">联系地址</label>  
  
					</div>  
				</div>  
				<div class="form-bg">  
					<div id="u" class="form-group">  
						<input id="deposit"  class="form-control" name="deposit" type="tel"   
						 required="required" placeholder="保证金(万元)" maxlength="30">  
						  
						<label for="deposit" class="float-label">请输入保证金</label>  
  
					</div>  
				</div>  
				<div class="form-bg" style="margin-bottom: 0rem;">  
					<div id="u" class="form-group">  
						<input id="joiningFee"  class="form-control" name="joiningFee" type="tel"   
						 required="required" placeholder="请输入加盟费" maxlength="30">  
						  
						<label for="joiningFee" class="float-label">加盟费(万元)</label>  
  
					</div>  
				</div>  
  
  
			</form> -->  
  
  
			<form class="mui-input-group bg-fff">  
				<div class="mui-input-row">  
					<h5>代理商名称</h5>  
					<input id="partnerName" type="text" class="mui-input-clear" placeholder="请输入代理商名称">  
				</div>  
				<div class="mui-input-row">  
					<h5>身份证号</h5>  
					<input id="identityNo" type="text" class="mui-input-clear" placeholder="请输入身份证号" style="width: 88%;">  
					<a id="frontNo"><img src="../images/agent/scan.png" style="height: 1.458125rem;width: 1.5rem;vertical-align: middle;"></a>  
				</div>  
				<div class="mui-input-row">  
					<h5>联系电话</h5>  
					<input id="mobile" type="text" class="mui-input-clear" placeholder="请输入联系人电话">  
				</div>  
				<div class="mui-input-row">  
					<h5>电子邮箱</h5>  
					<input id="email" type="text" class="mui-input-clear" placeholder="请输入电子邮箱">  
				</div>  
				<div class="mui-input-row">  
					<h5>地区</h5>  
					<button id="address" type="button" class="mui-btn mui-btn-outlined mui-text-left" style="border:none;padding: 12px 1rem;width: 100%;font-size: 1rem;color: #B8B7BD;border-radius: 0.25rem;">请选择地区<img  
						 class="mui-pull-right" id="time_img" <img class="mui-pull-right" id="time_img" src="../images/drop_down.png" />  
					</button>  
				</div>  
				<div class="mui-input-row">  
					<h5>联系地址</h5>  
					<input id="detail" type="text" class="mui-input-clear" placeholder="请输入联系地址">  
				</div>  
				<div class="mui-input-row">  
					<h5>保证金(万元)</h5>  
					<input id="deposit" type="number" class="mui-input-clear" placeholder="请输入保证金额">  
				</div>  
				<div class="mui-input-row">  
					<h5>加盟费(万元)</h5>  
					<input id="joiningFee" type="number" class="mui-input-clear" placeholder="请输入加盟费">  
				</div>  
			</form>  
		</div>  
		<div class="mui-button-row" style="margin: 24px 15px;">  
			<button id="nextbtn" type="button" class="mui-btn mui-btn-blue mui-btn-block golden-btn-bg" style="border: none;">下一步</button>  
		</div>  
			</div>  
		<script src="../js/mui.min.js"></script>  
		<script src="../js/mui.picker.min.js" type="text/javascript" charset="utf-8"></script>  
		<script src="../js/mui.poppicker.js" type="text/javascript" charset="utf-8"></script>  
		<script src="../js/city.data-3.js" type="text/javascript" charset="utf-8"></script>  
		<script src="../js/app.js" type="text/javascript" charset="utf-8"></script>  
		<script src="../js/ajax.js" type="text/javascript" charset="utf-8"></script>  
		  
		<script type="text/javascript">  
			(function($, doc) {  
					$.init({  
						swipeBack: true //启用右滑关闭功能  
					});  
					$.plusReady(function() {  
						app.iphoneXFit();  
						// 动态改变webview的侧滑返回功能:  
						// 关闭侧滑返回功能  
						var self = plus.webview.currentWebview();  
						  
						  
						  
						/*if($.os.android) {  
							var originalHeight = document.documentElement.clientHeight || document.body.clientHeight;  
  
							window.onresize = function() {  
  
								//软键盘弹起与隐藏  都会引起窗口的高度发生变化  
								var resizeHeight = document.documentElement.clientHeight || document.body.clientHeight;  
  
								console.log('resizeHeight===' + resizeHeight);  
								console.log('originalHeight===' + originalHeight);  
								if (resizeHeight + 200 < originalHeight) { //resizeHeight<originalHeight证明窗口被挤压了  
									self.setStyle({  
										'bottom': '0px'  
									});  
								} else {  
									self.setStyle({  
										'bottom': '51px'  
									});  
								}  
							}  
						}*/  
						var identityNo = doc.getElementById('identityNo');  
						var frontNo = doc.getElementById('frontNo');  
						var partnerName = doc.getElementById("partnerName"), //代理商名称  
							mobile = doc.getElementById("mobile"), //联系手机号  
							email = doc.getElementById("email"), //电子邮箱  
							address = doc.getElementById("address"), //地址  
							detail = doc.getElementById("detail"), //详细地址  
							deposit = doc.getElementById("deposit"), //保证金  
							joiningFee = doc.getElementById("joiningFee"), //加盟费  
							nextButton = doc.getElementById('nextbtn');  
  
  
						address.addEventListener('tap', function() {  
							app.pickerBlur();  
							// openFloat();  
							app.openBottomFloat('../tab-smallcustomer/webview_float.html', 'float', '50%', '100%', '请选择居住地区','0px','transparent');  
							plus.webview.currentWebview().setStyle({  
								mask: 'rgba(0,0,0,0.3)'  
							});  
						}, false);  
  
						//省份城市的回调方法  
						window.addEventListener('regionCode', function(event) {  
							// settleCity = event.detail.regionCode;  
							// settleProvice = event.detail.proviceCode;  
							address.style.color = '#323133';  
							address.innerHTML = event.detail.province + ' ' + event.detail.city +  
								'<img class="mui-pull-right" id="time_img" src="../images/drop_down.png" />';  
								plus.webview.currentWebview().setStyle({  
									mask: 'none'  
								});  
						});  
						  
						  
						  
						plus.webview.currentWebview().addEventListener("maskClick", function() {  
							plus.webview.getWebviewById('float').close();  
							plus.webview.currentWebview().setStyle({  
								mask: 'none'  
							});  
						}, false);  
  
  
						frontNo.addEventListener('tap', function() {  
  
							if (mui.os.android) {  
								plus.plugintest.RequestPermission('请求权限', function(result) {  
									app.getImage(function(path) {  
										compressImage(path);  
									});  
								}, function(err) {});  
							} else {  
								app.getImage(function(path) {  
									compressImage(path);  
								});  
							}  
						});  
  
  
  
						function compressImage(e) {  
							//图片压缩  
							// var size = 0;  
  
							var name = e.substr(e.lastIndexOf('/') + 1);  
							plus.zip.compressImage({  
									src: e,  
									dst: '_doc/' + name,  
									overwrite: true,  
									quality: 50,  
									format: 'jpg',  
									width: "80%",  
								},  
								function(zip) {  
									//size += zip.size;  
									if (zip.size > (500 * 1024)) {  
										compressImage(zip.target);  
									} else {  
										getidCard(zip.target);  
									}  
								},  
								function(zipe) {  
									mui.toast('压缩失败!')  
								}  
							);  
						}  
  
  
						function getidCard(imgeURl) {  
							app.getBase64Image(imgeURl, true, function(base64Image) {  
  
								var option = {  
									id_card_side: 'front',  
									image: base64Image,  
								}  
								var requestUrl = 'https://aip.baidubce.com/rest/2.0/ocr/v1/idcard';  
								ajax_uploadBase64Image(requestUrl, option, function(data) {  
									if (data.image_status == 'normal') {  
										// legalPerson.value = data.words_result['姓名'].words;  
										identityNo.value = data.words_result['公民身份号码'].words;  
									} else {  
										plus.nativeUI.toast('识别失败,请重试');  
									}  
									console.log(JSON.stringify(data));  
								}, function(err) {  
									plus.nativeUI.toast(err);  
								});  
							});  
						}  
  
  
  
  
  
						function createAgentBaseInfo() {  
							nextButton.classList.add('mui-disabled');  
							var parameter = {  
								curPartnerNo: plus.storage.getItem('partnerNo'),  
								partnerName: partnerName.value.trim(),  
								mobile: mobile.value,  
								email: email.value,  
								address: address.innerText + detail.value,  
								deposit: deposit.value,  
								joiningFee: joiningFee.value,  
								identityNo: identityNo.value.replace(/\s/g, ''),  
							}  
							ajax_request('partnerCreateAgent/createAgentBaseInfo.action?', parameter, function(requestData) {  
								nextButton.classList.remove('mui-disabled');  
								if (requestData.code == "0000") {  
									var obj = {  
										partnerNo: requestData.mobileData.partnerNo,  
									}  
									app.pushToWithParameter('set-lower-level.html', 'set-lower-level', obj);  
								} else {  
									plus.nativeUI.toast(requestData.msg);  
								}  
							}, function(err) {  
								nextButton.classList.remove('mui-disabled');  
								plus.nativeUI.toast(err);  
							});  
						}  
  
  
  
  
						//监听下一步按钮点击事件  
						nextButton.addEventListener('tap', function(event) {  
							app.pickerBlur();  
							//alert(address.innerText  == '请选择所属地区');  
							if (partnerName.value.trim() == '') {  
								plus.nativeUI.toast('请输入代理商名称!');  
								return;  
							} else {  
								if (!app.checkPartnerName(partnerName.value.trim())) {  
									return;  
								}  
							};  
  
							if (!app.checkIdNumber(identityNo.value.replace(/\s/g, ''))) {  
								return;  
							}  
  
							if (mobile.value == '') {  
								plus.nativeUI.toast('请输入联系人手机号!');  
								return;  
							} else {  
								if (!app.checkMobile(mobile.value)) {  
									return;  
								}  
							};  
							if (email.value == '') {  
								plus.nativeUI.toast('请输入电子邮箱!');  
								return;  
							} else {  
								if (!app.checkEmail(email.value)) {  
									plus.nativeUI.toast("您输入的邮箱有误,请重新核对后再输入!");  
									return;  
								}  
							};  
							if (address.innerText == '请选择所属地区') {  
								plus.nativeUI.toast('请选择所属地区!');  
								return;  
							};  
							if (deposit.value == '') {  
								plus.nativeUI.toast('请输入保证金!');  
								return;  
							};  
							if (joiningFee.value == '') {  
								plus.nativeUI.toast('请输入加盟费!');  
								return;  
							};  
  
							createAgentBaseInfo();  
						});  
					});  
				}  
  
			)(mui, document);  
		</script>  
	</body>  
  
</html>  

重现步骤

[步骤]

[结果]

[期望]

[如果语言难以表述清晰,拍一个视频或截图,有图有真相]

IDE运行环境说明

[HBuilder 或 HBuilderX。如果你用其他工具开发uni-app,也需要在此说明]

[IDE版本号] xcode 10.3 ios sdk:iOSSDK@2.3.6.70402_20191021 离线打包

[windows版本号]

[mac版本号] 10.14.4

uni-app运行环境说明

[运行端是h5或app或某个小程序?] ios离线打包,

[运行端版本号]

[项目是cli创建的还是HBuilderX创建的?如果是cli创建的,请更新到最新版cli再试]

[编译模式是老模板模式还是新的自定义组件模式?]

App运行环境说明

[Android版本号]

[iOS版本号] 13.1.2

[手机型号] iphone xs max

[模拟器型号]

附件

[IDE问题请提供HBuilderX运行日志。菜单帮助-查看运行日志,点右键打开文件所在目录,将log文件压缩成zip包上传]

[App问题请提供可重现问题的代码片段,你补充的细一点,问题就解决的快一点]

[App安装包或H5地址]

[可重现代码片段]

联系方式

[QQ] 287515218

manifest.json 设置 "kernel"{
"ios": "UIWebview" 这里不管是设置WKWebview,或者UIWebview都会
}

"softinput": {
"navBar": "auto",
"auxiliary": true,
"mode": "adjustResize" 这里不管是设置adjustResize,或者adjustPad都会
},
演示视频在附件中。

2019-10-24 11:33 负责人:无 分享
已邀请:
DCloud_iOS_XHY

DCloud_iOS_XHY

用最新的HBuilderX内置基座版本测试没有复现问题,如果你是离线打包请确保所有依赖库已经更新到最新,或者直接用最新离线包里面的工程测试

  • j***@163.com (作者)

    是最新的。我试过了,ios 12,11都可以,就是13.1有这个问题。


    2019-10-24 21:03

  • j***@163.com (作者)

    在mui.min.js中注释如下代码:


    d.contains(c) && (d.remove(c), setTimeout(function () {


    window.scrollTo(b.body.scrollLeft, b.body.scrollTop)


    }, 20))


    2019-10-24 21:54

风天宇

风天宇

这个问题解决了吗,楼主,按照你说的删除了几行js,也不行呀

该问题目前已经被锁定, 无法添加新回复