最新文章专题视频专题问答1问答10问答100问答1000问答2000关键字专题1关键字专题50关键字专题500关键字专题1500TAG最新视频文章推荐1 推荐3 推荐5 推荐7 推荐9 推荐11 推荐13 推荐15 推荐17 推荐19 推荐21 推荐23 推荐25 推荐27 推荐29 推荐31 推荐33 推荐35 推荐37视频文章20视频文章30视频文章40视频文章50视频文章60 视频文章70视频文章80视频文章90视频文章100视频文章120视频文章140 视频2关键字专题关键字专题tag2tag3文章专题文章专题2文章索引1文章索引2文章索引3文章索引4文章索引5123456789101112131415文章专题3
当前位置: 首页 - 科技 - 知识百科 - 正文

JS交互点击WKWebView中的图片实现预览效果

来源:动视网 责编:小采 时间:2020-11-27 22:22:16
文档

JS交互点击WKWebView中的图片实现预览效果

JS交互点击WKWebView中的图片实现预览效果: Swift 4.0 WKWebView 1.注入js代码 (重点) func webView(_ webView: WKWebView, didFinish navigation: WKNavigation!) { let jsGetImages = function getImages(){ + var objs = document.
推荐度:
导读JS交互点击WKWebView中的图片实现预览效果: Swift 4.0 WKWebView 1.注入js代码 (重点) func webView(_ webView: WKWebView, didFinish navigation: WKNavigation!) { let jsGetImages = function getImages(){ + var objs = document.


  • Swift 4.0
  • WKWebView
  • 1.注入js代码 (重点)

    func webView(_ webView: WKWebView, didFinish navigation: WKNavigation!) {
     let 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;" +
     "};"
     webView.evaluateJavaScript(jsGetImages, completionHandler: nil)
     webView.evaluateJavaScript("getImages()") { (data, err) in
     let imageUrl:String = data as! String
     var urlArry = imageUrl.components(separatedBy: "+")
     urlArry.removeLast()
     self.imgUrlArray.addObjects(from: urlArry)
     for url in self.imgUrlArray{
     let photo = SKPhoto.photoWithImageURL(url as! String)
     photo.shouldCachePhotoURLImage = false // you can use image cache by true(NSCache)
     self.images.append(photo)
     }
     }
     var jsClickImage:String
     jsClickImage = 
     "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.evaluateJavaScript(jsClickImage, completionHandler: nil)
     webView.evaluateJavaScript("registerImageClickAction()", completionHandler: nil)
    }

    2.使用SKPhotoBrowser框架实现图片预览功能

    func webView(_ webView: WKWebView, decidePolicyFor navigationAction: WKNavigationAction, decisionHandler: @escaping (WKNavigationActionPolicy) -> Void) {
     let requestString = navigationAction.request.url?.absoluteString
     print(requestString!)
     if (requestString?.hasPrefix("image-preview"))!{
     let imgUrl = NSString.init(string: requestString!).substring(from: "image-preview:".count )
     let index = imgUrlArray.index(of: imgUrl)
     let browser = SKPhotoBrowser(photos: images)
     browser.initializePageIndex(index)
     present(browser, animated: true, completion: {})
     }
     decisionHandler(.allow) //一定要加上这句话 
    }

    总结

    以上所述是小编给大家介绍的JS交互点击WKWebView中的图片实现预览效果,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持!

    文档

    JS交互点击WKWebView中的图片实现预览效果

    JS交互点击WKWebView中的图片实现预览效果: Swift 4.0 WKWebView 1.注入js代码 (重点) func webView(_ webView: WKWebView, didFinish navigation: WKNavigation!) { let jsGetImages = function getImages(){ + var objs = document.
    推荐度:
    • 热门焦点

    最新推荐

    猜你喜欢

    热门推荐

    专题
    Top