前言
由于公司項(xiàng)目需求,今天看了看關(guān)于js和webview交互的一些東西仔戈,由于以前沒接觸過這塊关串,算是自己的一個(gè)盲區(qū),因此記錄下來监徘,代碼實(shí)現(xiàn)的過程很簡(jiǎn)短晋修,先在此敲作一磚。
正文
1凰盔、獲取 <img>
元素
在webview的代理方法webViewDidFinishLoad
中用js實(shí)現(xiàn)對(duì)頁(yè)面圖片URL數(shù)組的獲饶关浴:
static NSString *const jsGetImages =
@"function getImages(){\
var objs = document.getElementsByTagName(\"img\");\
var imgScr = '';\
for(var i=0;i<objs.length;i++){\
imgScr = imgScr + objs[i].src + '+';\
};\
return imgScr;\
};";
//注入js方法
[webView stringByEvaluatingJavaScriptFromString:jsGetImages];
NSString *urlResurlt = [webView stringByEvaluatingJavaScriptFromString:@"getImages()"];
urlResurlt獲取到的是URL字符串,將其拆分到數(shù)組:
_mUrlArray = [NSMutableArray arrayWithArray:[urlResurlt componentsSeparatedByString:@"+"]];
//去除最后一個(gè)空元素
if (_mUrlArray.count >= 2) {
[_mUrlArray removeLastObject];
}
2户敬、添加圖片可點(diǎn)擊js
[_webView stringByEvaluatingJavaScriptFromString:@"function registerImageClickAction(){\
var imgs=document.getElementsByTagName('img');\
var length=imgs.length;\
for(var i=0;i<length;i++){\
img=imgs[i];\
img.onclick=function(){\
window.location.href='image-preview:'+this.src}\
}\
}"];
[_webView stringByEvaluatingJavaScriptFromString:@"registerImageClickAction();"];
3落剪、捕獲到圖片的點(diǎn)擊事件
在webView的shouldStartLoadWithRequest
代理方法中獲取被點(diǎn)擊圖片的url:
- (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType {
if ([request.URL.scheme isEqualToString:@"image-preview"]) {
NSString* path = [request.URL.absoluteString substringFromIndex:[@"image-preview:" length]];
path = [path stringByAddingPercentEscapesUsingEncoding:NSUTF8StringEncoding];
//path 就是被點(diǎn)擊圖片的url
[self loadPhotoWith:path];
return NO;
}
return YES;
}
4睁本、顯示圖片
這里我用的是IDMPhotoBrowser:
- (void)loadPhotoWith: (NSString *)path {
// URLs array
__block NSInteger index;//圖片點(diǎn)擊的序號(hào)
NSMutableArray *photosURL = [NSMutableArray array];
[_mUrlArray enumerateObjectsUsingBlock:^(id _Nonnull obj, NSUInteger idx, BOOL * _Nonnull stop) {
NSURL *url = [NSURL URLWithString:obj];
[photosURL addObject:url];
if ([path isEqualToString:obj]) {
index = idx;
}
}];
// Create an array to store IDMPhoto objects
NSMutableArray *photos = [NSMutableArray new];
for (NSURL *url in photosURL) {
IDMPhoto *photo = [IDMPhoto photoWithURL:url];
[photos addObject:photo];
}
IDMPhotoBrowser *browser = [[IDMPhotoBrowser alloc] initWithPhotos:photos];
browser.displayCounterLabel = YES;
browser.displayActionButton = NO;
browser.displayArrowButton = YES;
[browser setInitialPageIndex:index];
[self presentViewController:browser animated:YES completion:nil];
}