iOS端Cordova InAppBrowser在iPad下focus()无法稳定唤起软键盘问题
iOS InAppBrowser 软键盘收起后焦点重置导致键盘闪烁问题解决
这个问题确实是iOS InAppBrowser的特定行为差异,我之前也碰到过类似的情况。核心原因在于两种blur触发方式的底层逻辑完全不同:
- 方式1(点击input2):属于Web页面内部的焦点切换,整个WebView的
firstResponder状态并没有丢失,所以调用focus()能正常唤起软键盘。 - 方式2(点击软键盘收起按钮):是系统触发了WebView的
resignFirstResponder,此时WebView完全失去了第一响应者权限,后续JS调用focus()时,系统可能因为刚完成键盘收起的动画/状态重置,导致键盘短暂唤起后又被系统收回,出现闪烁现象。
下面给你两种层级的解决方案,优先尝试前端调整,不行再考虑原生插件修改:
一、前端代码调整(无需修改原生)
核心思路是监听系统键盘隐藏事件,在键盘完全收起后再执行焦点重置,避免和系统的状态切换冲突。修改你的onBlur函数如下:
function onBlur(event) { const targetInput = event.target; if(targetInput.value === 'abc') { targetInput.style.backgroundColor="#ffffff"; return true; } targetInput.style.backgroundColor = "#ff0000"; // 先移除可能存在的旧监听,防止重复绑定 window.removeEventListener('webkitkeyboarddidhide', handleKeyboardHide); function handleKeyboardHide() { // 延迟100ms确保系统键盘状态完全稳定 setTimeout(() => { targetInput.focus(); // 额外触发click增强唤起键盘的可靠性 targetInput.click(); // 打印当前活跃元素验证 setTimeout(() => alert(document.activeElement.id), 500); }, 100); // 执行后移除监听,避免内存泄漏 window.removeEventListener('webkitkeyboarddidhide', handleKeyboardHide); } // 先弹出提示,再绑定键盘隐藏监听 setTimeout(() => { alert('Please input abc'); // 只有当是点击软键盘收起触发的blur时,这个监听才会生效 window.addEventListener('webkitkeyboarddidhide', handleKeyboardHide); }, 0); return false; }
另外可以尝试替换JS原生alert:因为iOS的JS alert会暂时抢占WebView的焦点,可能加剧状态冲突。如果你的App集成了Cordova的Dialogs插件,可以用navigator.notification.alert()代替原生alert,它的底层是iOS的UIAlertController,对WebView焦点的影响更小。
二、修改InAppBrowser原生代码(前端方案无效时)
如果前端调整还是无法解决,就需要修改Cordova InAppBrowser插件的Objective-C代码,强制在键盘收起后让WebView保持第一响应状态:
- 找到InAppBrowser插件的
InAppBrowserViewController.m文件 - 在
viewDidLoad方法中添加键盘隐藏监听:
- (void)viewDidLoad { [super viewDidLoad]; // 其他原有代码... // 添加键盘隐藏通知监听 [[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(onKeyboardDidHide:) name:UIKeyboardDidHideNotification object:nil]; }
- 实现监听回调方法,通过JS注入强制指定输入框获焦:
- (void)onKeyboardDidHide:(NSNotification *)notification { // 注入JS代码让input1重新获焦 NSString *focusScript = @"var input = document.getElementById('input1'); if(input) { input.focus(); input.click(); }"; [self.webView evaluateJavaScript:focusScript completionHandler:^(id _Nullable result, NSError * _Nullable error) { if(error) { NSLog(@"Failed to focus input: %@", error.localizedDescription); } }]; }
- 记得在
dealloc方法中移除监听,避免内存泄漏:
- (void)dealloc { [[NSNotificationCenter defaultCenter] removeObserver:self]; // 其他原有dealloc代码... }
修改完成后,重新编译Cordova项目即可生效。
内容的提问来源于stack exchange,提问作者fcmpww
相关产品推荐
相关产品推荐

