IOS - 非全屏 webview 没有“touchend”事件答案

【问题标题】：IOS - No "touchend" event for not fullscreen webviewIOS - 非全屏 webview 没有“touchend”事件
【发布时间】：2014-11-03 19:21:38
【问题描述】：

当触摸在 web 视图之外结束时，“onTouchEnd”不会触发。使用 XCode 6、iOs 8、iPhone 6 编译

我有下一个布局：

|Navigation TAB|
|Left view|Web view|Right view|
|page view|

我可以在 Web 视图中接收所有触摸事件（触摸开始和结束时）。但是，如果我在 webview 中开始触摸，然后将触摸移出它，我将在离开 webview 边框后立即停止接收 touchmove 事件，并且不会收到 touchend 事件。

测试html文件的代码：

  <head>
  </head>
  <body bgcolor="#CC6"
      ontouchmove="console.info('move');"
      ontouchstart="console.info('start');"
      ontouchend="console.info('end');"
      ontouchcancelled="console.info('canceled');"
  >
  <h1>This is a test</h1>
  <p> Lore ip sum </p>
  </body>

“viewDidLoad”函数代码

[super viewDidLoad];
// Do any additional setup after loading the view, typically from a nib.

self.webView = [[UIWebView alloc] initWithFrame:self.mainView.bounds];

[self.webView setScalesPageToFit:YES];
[self.webView setAlpha:1];

/* Disable scrolling of web view */
for (id subview in [self.webView subviews]) {
    if ([subview isKindOfClass:[UIScrollView class]]) {
        ((UIScrollView*)subview).bounces = NO;
    }
}

self.webView.scrollView.bounces = NO;
self.webView.scrollView.canCancelContentTouches = NO;
self.webView.scrollView.scrollEnabled = NO;

self.webView.backgroundColor = [UIColor magentaColor]; //[UIColor colorWithRed:(45.0/255.0) green:(50.0/255.0) blue:(53.0/255.0) alpha:1];
self.webView.autoresizingMask = UIViewAutoresizingFlexibleLeftMargin| UIViewAutoresizingFlexibleTopMargin | UIViewAutoresizingFlexibleRightMargin | UIViewAutoresizingFlexibleBottomMargin | UIViewAutoresizingFlexibleHeight | UIViewAutoresizingFlexibleWidth;
[self.mainView addSubview:self.webView];


NSString * localHtmlFilePath = [[NSBundle mainBundle] pathForResource:@"main" ofType:@"html" inDirectory:@"www"];
NSString *html = [NSString stringWithContentsOfFile:localHtmlFilePath encoding:NSUTF8StringEncoding error:nil]; 



[self.webView loadHTMLString:html baseURL:nil];

如何解决这个问题？是否有一些我遗漏的配置？

完整的源代码可以在这里找到：https://github.com/Daraku/WebViewBug

【问题讨论】：

标签： ios objective-c iphone webview uiwebview

【解决方案1】：

在过去的 30 分钟里我一直在苦苦挣扎，最后我决定实施一个超时，它会随着每个 touchmove 恢复并从 touchstart 开始，并在 touchend 上清除。超时是为了让我们说1500ms，如果我没有在webview 中得到应有的touchend，我会在超时结束时触发它。

希望我说明了一点。它并不完美，但可以作为部分修复。在我的情况下，iScroll（_execEvent（'scrollCancel'））的hackaround

【讨论】：

setTimeout - hack，是我最终使用的（尽管我使用的时间值要小得多）。看起来，没有合适的解决方案:(

【解决方案2】：

我有一个类似的问题，我在本机应用程序中嵌入了一个 webview。本机应用程序的标题为 60 像素，其下方是 web 视图。

当从 webview 向上滑动并在标题上松开手指时，'touchend' 事件不会传播到 webview。

我发现将 webview 留在顶部时，'touchmove' 事件的 Y 坐标为负数，因此我通过监听它并以编程方式触发 touchend 事件来利用这一事实。像老板一样工作！

document.addEventListener("touchmove", function(e) {
if (e.changedTouches[0].pageY < 0) {
    e.preventDefault();
    document.dispatchEvent(new Event('touchend'));
}

}，假）；

这是相同代码的要点：https://gist.github.com/EddyVerbruggen/70b96fce47fa7bf7a34f03e3a2ecb85f

【讨论】：

很遗憾，当手指离开物理屏幕而不是 WebView 区域时，我需要捕捉它。
这正是我正在寻找的，因为只有在 iOS 状态栏上才会调用 touchend。当有电话打进来时，我仍然需要调用 touchend，因为这会导致覆盖也会破坏 touchend 事件。