iOS HTML图片本地预览

最新推荐文章于 2026-07-02 11:11:24 发布

原创

最新推荐文章于 2026-07-02 11:11:24 发布 · 4.1k 阅读

收录于

当前文章被以下社区和专栏收录：

本文介绍了如何在iOS应用中实现HTML图片的本地预览。通过UIWebView控件，结合javascript与Objective-C的交互，利用 webView:shouldStartLoadWithRequest:navigationType 接口，动态修改img标签的onclick事件，实现点击图片预览的功能。详细代码和原理分析帮助开发者理解并扩展相关功能。

1.引言

　相信用过苹果手机的童鞋，会发现很多新闻类的应用，都可以实现HTML图片本地预览，那么这是如何实现的呢？本文将深入阐述其中的原理.

　　关于此功能，我还实现了一个DEMO，大家可以点击此访问更详细内容

2.原理

接触过web开发的人，就了解与html元素交互都是通过javascript进行的，比如点击、滑动等，比如点击标签的响应代码如下

 

var img = document.getElementById('test'); 

img.onclick = function() { 

    do some thing 

}

顺着这个思路往下想，就可以推测出，在iOS中实现点击图片本地预览，也应该是跟javascript交互的，于是问题转换成了javascript与objc的交互. 关于javascript与objc的交互，google下一大堆，看似很复杂，其实非常简单，我这里简单阐述下，大家都知道在iOS中是用UIWebView控件来显示HTML的，那么javascript与objc要实现交互，桥梁必须是UIWebView，通过查看UIWebView提供的相关接口，可以找到如下接口:

- (NSString *)stringByEvaluatingJavaScriptFromString:(NSString *)script
- (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType;

第一个接口一目了然，即执行javascript，于是就打通了objc到javacript的路，那么javascript到objc呢？答案就是第二个接口，

标签