四、iOS与Web交互遇到的问题

最新推荐文章于 2023-10-25 09:02:16 发布

清春0104

最新推荐文章于 2023-10-25 09:02:16 发布

阅读量824

点赞数

CC 4.0 BY-SA版权

分类专栏： iOS 文章标签： ios

本文链接：https://blog.csdn.net/qq_16804091/article/details/86133838

本文讨论了iOS中Web APP开发时遇到的关键问题，包括键盘遮挡、数据交互规则、Web APP缓存清理、iOS环境下的调试方法、输入法引起的乱码问题，以及启动页和沉浸式样式配置等。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1、Web APP 在开发过程中不可避免的涉及到输入，所以今天来解决键盘弹起遮挡的问题

1.1.从iOS原生的方面解决:
// 添加键盘监听
- (void)addNotification {

    // 键盘即将出现
    [[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(keyboardWillShow:) name:UIKeyboardWillShowNotification object:nil];
    // 键盘出现
    [[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(keyboardDidShow:) name:UIKeyboardDidShowNotification object:nil];
    // 键盘即将消失
    [[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(keyboardWillHide:) name:UIKeyboardWillHideNotification object:nil];
    // 键盘消失
    [[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(keyboardDidHide:) name:UIKeyboardDidHideNotification object:nil];
}
- (void)keyboardWillShow:(NSNotification *)notification {
   
    [self.webView evaluateJavaScript:@"document.body.scrollTop" completionHandler:nil];
}
- (void)keyboardDidShow:(NSNotification *)notification {
    
    [self.webView evaluateJavaScript:@"document.body.scrollTop" completionHandler:nil];
}
- (void)keyboardWillHide:(NSNotification *)notification {
    
    [self.webView evaluateJavaScript:@"document.body.scrollTop = 0;" completionHandler:nil];
}
- (void)keyboardDidHide:(NSNotification *)notification {
    
    [self.webView evaluateJavaScript:@"document.body.scrollTop" completionHandler:nil];
}

1.2.从Web方面解决(在main.js中)：
mounted() {
	let myFunction
	if (isiOS) {
		document.body.addEventListener('focusin', () => { // 软键盘弹起事件
			clearTimeout(myFunction)
		})
     	document.body.addEventListener('focusout', () => { // 软键盘关闭事件
        	clearTimeout(myFunction)
        	myFunction = setTimeout(function() {
          		window.scrollTo({top: 0, left: 0, behavior: 'smooth'}) // 当键盘收起的时候让页面回到原始位置
        	}, 10)
      })
    }
  }
  
备注：由于很多Web APP引入了FastClick组件，在iOS设备上input标签键盘弹起会