IOS：如何在内容可编辑的 div 中检测用户更改 UIWebView 上的文本答案

【问题标题】：IOS: How do you detect user changing text on a UIWebView within a content editable divIOS：如何在内容可编辑的 div 中检测用户更改 UIWebView 上的文本
【发布时间】：2014-04-10 08:38:15
【问题描述】：

当使用带有可编辑内容的UIWebView 时，用户可以在可编辑的 DIV 上键入自己的文本。

有没有办法在每次用户更改可编辑文本时触发 ViewController 上的事件（类似于 the UITextField 值更改事件）？

ViewController 需要知道用户何时更改了文本，原因有两个；知道用户是否输入了任何文本，并随着内容文本的增长调整 UIWebView 的大小。

UIWebView 委托似乎不包含此类事件。这可能必须通过 Javascript 完成，但似乎无法找到答案。救命！

【问题讨论】：

标签： javascript ios objective-c uiwebview

【解决方案1】：

没有直接的方法来监听来自 UIWebView 的事件，但你可以桥接它们。由于 iOS7 这很容易，因为有 JavaScriptCore.framework（你需要将它与项目链接）：

JSContext *ctx = [webView valueForKeyPath:@"documentView.webView.mainFrame.javaScriptContext"];
ctx[@"myUpdateCallback"] = ^(JSValue *msg) {
    [self fieldUpdated];
};
[ctx evaluateScript:@"document.getElementById('myEditableDiv').addEventListener('input', myUpdateCallback, false);"];

（我目前无法测试代码，但我希望它可以工作）

在 iOS7 之前（如果你想支持低版本你必须使用这个）它有点棘手。您可以在 webView 委托方法 webView:shouldStartLoadWithRequest:navigationType: 上收听一些自定义方案，例如：

- (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType {
        if ([request.URL.scheme isEqualToString:@"divupdated"]) {
            [self fieldUpdated];
            return NO;
        }
        return YES;
}

并在 webView 上触发类似的内容：

[webView stringByEvaluatingJavaScriptFromString:@"document.getElementById('myEditableDiv').addEventListener('change', function () {"
                                                @"var frame = document.createElement('iframe');"
                                                @"frame.src = 'divupdated://something';"
                                                @"document.body.appendChild(frame);"
                                                @"setTimeout(function () { document.body.removeChild(frame); }, 0);"
                                                @"}, false);"];

【讨论】：

感谢 lupatus，您首先发布了因此标记为答案。

【解决方案2】：

你需要做一些 JS hack 才能让它工作。

首先，创建一个带有脚本的 JS 文件，该脚本添加一个观察者，观察所有可编辑的 div 何时开始被编辑（我不知道这应该如何在 JS 中完成，但在 Google 上进行快速搜索应该帮助）。然后回调应该调用一个特制的 url，比如：

textFieldBeginEditing://whateveryoulike

将 JS 文件注入 UIWebView。一种可能的技术：

- (void)injectJavascript:(NSString *)resource {
    NSString *jsPath = [[NSBundle mainBundle] pathForResource:resource ofType:@"js"];
    NSString *js = [NSString stringWithContentsOfFile:jsPath encoding:NSUTF8StringEncoding error:NULL];

    [self.webView stringByEvaluatingJavaScriptFromString:js];
}

取自another so thread。

最后，在UIWebViewDelegate method shouldStartLoadingRequest

- (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType
{
    // ... check the url schema
    NSURL *url = request.URL;
    if ([url.scheme isEqual:@"textFieldBeginEditing"]){
         // here you can handle the event
         return NO; // important
    }
}

【讨论】：