uni-app h5页面嵌套到钉钉里 华为手机video退出全屏后 input输入框无法唤起键盘 切到后台再回来才能恢复
uni-app h5页面嵌套到钉钉里 华为手机video退出全屏后 input输入框无法唤起键盘 切到后台再回来才能恢复
示例代码：
video 标签自带的大屏
大屏后
uni-easyinput标签 聚焦自带的调出手机键盘 调用不出手机键盘
## 操作步骤：
华为手机，鸿蒙系统，
在钉钉里面嵌套的h5页面，
有一个交互导致的一个bug，
条件是
页面中同事存在input输入框和video视频播放器
交互是
正常一进来input输入框是能调用虚拟键盘的，但是点击video全屏播放后，在缩小，这个时候再点击input就会导致虚拟键盘调不出来
这个时候刷新页面，或者后台一下钉钉在进入，就能继续调用出虚拟键盘了
预期结果：
能够调用虚拟键盘
## 实际结果：
调用不了虚拟键盘
bug描述：
h5页面 嵌套到钉钉里面 video退出全屏input输入框，无法唤起键盘，切到后台再回来才能出来
华为手机，鸿蒙系统，
在钉钉里面嵌套的h5页面，
有一个交互导致的一个bug，
条件是
页面中同事存在input输入框和video视频播放器
交互是
正常一进来input输入框是能调用虚拟键盘的，但是点击video全屏播放后，在缩小，这个时候再点击input就会导致虚拟键盘调不出来
这个时候刷新页面，或者后台一下钉钉在进入，就能继续调用出虚拟键盘了
目前有这个bug
### 项目信息
| 项目信息 | 详细信息 |
|----------------|------------------|
| 产品分类 | uniapp/H5 |
| PC开发环境操作系统 | Windows |
| PC开发环境操作系统版本号 | 1 |
| HBuilderX类型 | 正式 |
| HBuilderX版本号 | 4.24 |
| 浏览器平台 | Chrome |
| 浏览器版本 | 钉钉内置浏览器 |
| 项目创建方式 | HBuilderX |
针对您提到的uni-app H5页面嵌套到钉钉里，华为手机在video退出全屏后input输入框无法唤起键盘的问题，这里提供一种可能的解决方案。此问题可能是由于视频全屏播放后页面的焦点或上下文状态发生了变化，导致input元素无法正确获取焦点。
以下是一个可能的代码示例，用于尝试解决该问题。此示例将包括一个video元素和一个input元素，并在video元素结束全屏播放时尝试重新聚焦到input元素。
<template>
<view>
<!-- Video Element -->
<video
id="myVideo"
src="your-video-url.mp4"
controls
@fullscreenchange="handleFullscreenChange"
></video>
<!-- Input Element -->
<input
type="text"
v-model="inputValue"
placeholder="Click to type"
ref="myInput"
/>
</view>
</template>
<script>
export default {
data() {
return {
inputValue: '',
};
},
methods: {
handleFullscreenChange() {
// Check if the video is no longer in fullscreen mode
const video = document.getElementById('myVideo');
if (!document.fullscreenElement) {
// Try to focus the input element after exiting fullscreen
this.$nextTick(() => {
this.$refs.myInput.focus();
});
}
},
},
};
</script>
<style scoped>
/* Add any necessary styles here */
</style>
在这个示例中，我们使用了@fullscreenchange事件监听器来检测video元素是否退出了全屏模式。一旦检测到全屏模式已退出（document.fullscreenElement为null），我们将尝试使用this.$refs.myInput.focus()方法将焦点设置到input元素上。注意，这里使用了this.$nextTick()来确保DOM更新完成后再尝试聚焦。
然而，由于钉钉内嵌H5页面的复杂性，以及不同设备和浏览器之间的行为差异，这个解决方案可能并不总是有效。如果问题依然存在，您可能需要考虑以下额外步骤：
- 检查钉钉版本：确保您使用的钉钉版本是最新的，因为旧版本可能存在已知的bug。
- 调整页面结构：尝试改变video和input元素的布局或嵌套方式，看是否能影响焦点行为。
- 使用定时器：在某些情况下，您可能需要使用
setTimeout来延迟聚焦尝试，以等待页面状态完全恢复。
希望这些建议能对您有所帮助！如果问题仍然无法解决，建议进一步调查钉钉的官方文档或社区，以获取更具体的指导。
