? ? ? H5出來(lái)以后影響越來(lái)越牛逼短条，以前需要移動(dòng)端苦逼多天搞出來(lái)的不錯(cuò)的原生復(fù)雜頁(yè)面溺拱，現(xiàn)在在開(kāi)發(fā)中多了一種選擇讯嫂，那就是運(yùn)用H5. H5的運(yùn)用除了一些很簡(jiǎn)單的靜態(tài)頁(yè)面不需要移動(dòng)端多做處理外谬盐，更多的時(shí)候需要移動(dòng)端與H5頁(yè)面交互來(lái)處理一些點(diǎn)擊事件。
? ? ? 好了廢話不多說(shuō)渣锦，直接上代碼硝岗。先來(lái)說(shuō)一說(shuō)UIWebView，這是iOS加載網(wǎng)頁(yè)或者其他格式文件常用的控件袋毙。
? ? ? UIWebView加載的api有三種
- (void)loadRequest:(NSURLRequest *)request;
- (void)loadHTMLString:(NSString *)string baseURL:(nullable NSURL *)baseURL;
- (void)loadData:(NSData *)data MIMEType:(NSString *)MIMEType textEncodingName:(NSString *)textEncodingName baseURL:(NSURL *)baseURL;
其中第一個(gè)- (void)loadRequest:(NSURLRequest *)request; 我們運(yùn)用的時(shí)候最常見(jiàn)型檀。就是直接將url加載就可以了
NSString *path = @"";
NSURL *url = [[NSURL alloc] initWithString:path];
[self.webView loadRequest:[NSURLRequest requestWithURL:url]];
第二個(gè)是一種加載本地文件或者數(shù)據(jù)返回的html數(shù)據(jù)
加載本地html -->
NSString *resourcePath = [ [NSBundle mainBundle] resourcePath];
NSString *filePath = [resourcePath stringByAppendingPathComponent:@"test.html"];
NSString *htmlstring =[[NSString alloc] initWithContentsOfFile:filePath encoding:NSUTF8StringEncoding error:nil];
[self.webView loadHTMLString:htmlstring baseURL:[NSURL fileURLWithPath: [[NSBundle mainBundle] bundlePath]]];
加載返回的數(shù)據(jù)，只要把htmlstring對(duì)應(yīng)替換就ok了听盖。
至于第三種加載方式胀溺，跟第二種方式類(lèi)似，只是更具體把web content的編碼方式接口給出來(lái)媳溺。至于MIMEType我也來(lái)簡(jiǎn)單介紹下月幌，MIMEType指的是content媒體類(lèi)型，比如HTML悬蔽，XML,GIF,FLASH扯躺，瀏覽器就是根據(jù)這個(gè)類(lèi)型的不同會(huì)選擇用不同的形式來(lái)顯示。
常見(jiàn)的MIME類(lèi)型
超文本標(biāo)記語(yǔ)言文本 .html,.html text/html
普通文本 .txt text/plain
RTF文本 .rtf application/rtf
GIF圖形 .gif image/gif
JPEG圖形 .ipeg,.jpg image/jpeg
au聲音文件 .au audio/basic
MIDI音樂(lè)文件 mid,.midi audio/midi,audio/x-midi
RealAudio音樂(lè)文件 .ra, .ram audio/x-pn-realaudio
MPEG文件 .mpg,.mpeg video/mpeg
AVI文件 .avi video/x-msvideo
GZIP文件 .gz application/x-gzip
TAR文件 .tar application/x-tar
同時(shí)UIWebView 中公開(kāi)四個(gè)方法
- (void)reload;//重新加載該網(wǎng)頁(yè)
- (void)stopLoading;//停止加載
- (void)goBack;//后退
- (void)goForward;//前進(jìn)
UIWebView 一個(gè)常用的屬性scalesPageToFit 蝎困，該屬性可以自動(dòng)對(duì)頁(yè)面進(jìn)行縮放以適應(yīng)屏幕录语，但是有時(shí)候會(huì)造成要展示的圖片等資源過(guò)小，不方便展示禾乘。解決這類(lèi)問(wèn)題的方法澎埠，我總結(jié)出兩種，一種是最簡(jiǎn)單不需要我們移動(dòng)端更改什么始藕，只要H5代碼中在CSS樣式中對(duì)對(duì)應(yīng)的width就行auto設(shè)置蒲稳；一種就要用到UIWebView的協(xié)議UIWebViewDelegate
UIWebViewDelegate 常用的代理方法
- (void)webView:(UIWebView *)webView didFailLoadWithError:(NSError *)error
{//(@"加載失敗");}
- (void)webViewDidFinishLoad:(UIWebView *)webView
{//這個(gè)方法中調(diào)用更改web view Frame的方法}
- (void)webViewDidStartLoad:(UIWebView *)webView
{//(@"加載中...");}
- (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType
{
NSString *currentURL= webView.request.URL.absoluteString;
//這個(gè)方法是UIWebView 開(kāi)始加載網(wǎng)頁(yè) 或者是響應(yīng)網(wǎng)頁(yè)內(nèi)超鏈接和點(diǎn)擊事件的必走方法。上面的currentURL就是webview要加載或者響應(yīng)的URL伍派，利用這個(gè)我們也可以做一些事情江耀。比如在加載一個(gè)網(wǎng)頁(yè)后，其中一個(gè)點(diǎn)擊事件诉植，點(diǎn)擊后跳轉(zhuǎn)頁(yè)面祥国。如果這個(gè)要跳轉(zhuǎn)的下一頁(yè)我們移動(dòng)端要自定制一些控件也要展示到另一個(gè)viewcontroller中，那么webview自己點(diǎn)擊跳轉(zhuǎn)我們就不需要晾腔。我們移動(dòng)端可以讓H5只響應(yīng)事件的點(diǎn)擊但是不觸發(fā)舌稀，然后我們?cè)谶@個(gè)方法中截取響應(yīng)的URL自己跳轉(zhuǎn)頁(yè)面再用UIWebView加載URL就可以了
return YES;
}
好了，上面啰嗦那么多灼擂，終于要進(jìn)入這文章的主題壁查。
先寫(xiě)一種最簡(jiǎn)單的交互 事件 ，其中不會(huì)用第三方框架類(lèi)
首先既然是交互剔应，那就是webview與html雙方都要參與的睡腿。也就是移動(dòng)端和H5 要商量一個(gè)統(tǒng)一的方法康谆。
function huoQu(){
var jiedian = $(".cur").children().html();var newStr =jiedian.substring(0,jiedian.indexOf("天"));
alert(newStr);
return newStr;
}
其中上面這個(gè)方法就是Html在js文件公開(kāi)出來(lái)的一個(gè)方法，該js文件要確定加載到html標(biāo)簽中<script>中嫉到，不然無(wú)法調(diào)用。
NSString *RuesltStr = [self.myWebView stringByEvaluatingJavaScriptFromString:[NSString stringWithFormat:@"huoQu();"]];
這個(gè)就是移動(dòng)端在相應(yīng)的地方月洛，調(diào)用就ok何恶。返回的字段是什么樣式，就看你們的需要了嚼黔。自己個(gè)人總結(jié)不喜勿噴细层，謝謝！唬涧！
