我正在为我正在开发的 iPhone 应用程序尝试一个富文本编辑器(具有 HTML 导出功能)，并决定使用 iOS 5 的 WebKit 支持 contentEditable/designMode。
我遇到了一个问题，这个问题正在解决我所需要的问题。在 UIWebView 中编辑内容时，不会自动滚动以跟随光标，例如在 UITextView 中。打字时，光标继续在 scrollView 下方，用户必须手动向上滚动。
这里是一些相关的代码:
- (void)webViewDidFinishLoad:(UIWebView *)webView
{
NSString *string = @"document.body.contentEditable=true;document.designMode='on';void(0)";
[webView stringByEvaluatingJavaScriptFromString:string];
[[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(keyboardWillShow:) name:UIKeyboardWillShowNotification object:nil];
}
有什么办法可以解决这个问题吗？我不确定这是否也发生在 Safari 中或仅发生在 UIWebView 的 WebKit 实现中。
如果您遇到此问题，请务必前往 https://bugreport.apple.com并复制 rdar://16455638。
最佳答案
经过几个小时的研究，我找到了更好的解决方案，所以我想分享一下。
在 iOS 5 的 contentEditable 实现中有一个错误，主 scrollView 不会随着插入符号滚动。如果使 body 标签(或任何动态大小的元素)成为 contentEditable，插入符号将始终离开屏幕。
如果将可编辑的 div 设置为溢出:滚动，您会注意到 div 会滚动。默认情况下，div 的滚动不会“反弹”或有滚动条，但您可以将 -webkit-overflow-scrolling: touch 属性应用于 div 以解决此问题。
根据这些信息，您可以像这样使用包装器修复它:
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=no;"/>
<style type="text/css">
html, body {height: 100%;}
body {
margin: 0;
}
#wrap {
height: 100%;
width: 100%;
overflow-y: scroll;
-webkit-overflow-scrolling: touch;
}
#editor {
padding: 10px;
}
</style>
</head>
<body>
<div id="wrap">
<div id="editor" contenteditable="true">
</div>
</div>
</body>
</html>
基本上您滚动的是 div 而不是文档。
不幸的是，div 的“scrollView”无法识别虚拟键盘，因此插入符号会消失在键盘后面。但是，您会注意到插入符位置仍在键盘后面底部的屏幕上。因此，要解决此问题，请降低 div/UIWebView 的高度以容纳键盘。
您可能还想做的其他事情是在主 ScrollView 上禁用滚动:
webView.scrollView.scrollEnabled = NO;
主 scrollView 无论如何都不应该滚动，但它应该防止任何滚动故障。
关于ios - UIWebView 中的 contentEditable/designMode 时自动滚动，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/8523232/