通過接近N天的努力. 終于在今天.IOS下內(nèi)嵌HTML編輯器的Demo 基本實現(xiàn).學(xué)習(xí)過程中,參考了很多網(wǎng)上的資料.很感謝這些分享資源的牛人.有你們才能順利拿下這個比較特別的需求.
過程中找到兩個比較好的HTML編輯器是ZSSRichTextEditor和CKEditor玻褪,下面我會簡單的介紹這兩款HTML編輯器;途中難點在于,如何與內(nèi)嵌HTML編輯器進行數(shù)據(jù)交互,接下來,進入正題:
ZSSRichTextEditor
ZSSRichTextEditor 是個漂亮的iOS富文本W(wǎng)YSIWYG所見即所得的編輯器炫彩,它包含了一個標(biāo)準(zhǔn)WYSIWYG編輯器所應(yīng)該擁有的所有工具榴徐,此外還提供源代碼語法高亮查看功能自阱。
CKEditor
CKEditor 是當(dāng)前最為知名的 HTML 編輯器,它具有所有主流 HTML 編輯器所應(yīng)當(dāng)具備的特點:所見即所得、簡單易用框仔、開源并支持各種主流的瀏覽器(IE惠遏、Oper砾跃、FireFox、Chrome节吮、Safari)抽高。最重要的是,CKEditor 經(jīng)過 10 年的不斷完善和更新透绩,其穩(wěn)定性和兼容性已經(jīng)不容質(zhì)疑翘骂。
主要過程:
小兵用的是ZSSRichTextEditor HTML編輯器
1)利用UIWebView 內(nèi)嵌HTML編輯器實現(xiàn)IOS下用戶可以進行富文本編輯壁熄;主要目的是保證服務(wù)端的內(nèi)容值不丟失.亦可在移動端對內(nèi)容進行一些簡單的修改.
2)加載本地的html文件
[self.webViewsetUserInteractionEnabled:YES];
//是否支持交互[self.webViewsetOpaque:NO];
//opaque是不透明的意思
[self.webViewsetScalesPageToFit:YES];
//自動縮放以適應(yīng)屏幕
NSString* path = [[NSBundlemainBundle] pathForResource:@"11"ofType:@"html"];
NSURL* url = [NSURLfileURLWithPath:path];
//? ? NSString *str = @"http://192.168.5.120:7293/6.html";
//? ? NSURL *url = [NSURL URLWithString:str];
NSURLRequest* request = [NSURLRequestrequestWithURL:url] ;
? [self.webViewloadRequest:request];
3)在UIWebView的代理方法-(void)webViewDidFinishLoad:(UIWebView *)webView中提取html頁面元素,跳轉(zhuǎn)到編輯頁面
-(void)webViewDidFinishLoad:(UIWebView*)_webView{
NSLog(@"123");
NSString*strings1 = [self.webViewstringByEvaluatingJavaScriptFromString:@"document.body.innerHTML"];
//? ? 這里獲得的strings為word文檔內(nèi)容的html格式碳竟。
//? ? NSLog(@"%@--askl",strings);
indestr_body = [NSStringstringWithFormat:@"%@",strings1];
4)提取HTML數(shù)據(jù)到編輯器
到此大功告成草丧;
擴展:js與webview 常用交互代碼
常用JS語句:::1、//禁用用戶選擇
常用JS語句:::1莹桅、//禁用用戶選擇[self.webViewstringByEvaluatingJavaScriptFromString:@"document.documentElement.style.webkitUserSelect=‘none‘;"];
2昌执、//禁用長按彈出框
[webView stringByEvaluatingJavaScriptFromString:@"document.documentElement.style.webkitTouchCallout=‘none‘;"];
3、//獲得UIWebView的URL地址
NSString*currentURL = [webView stringByEvaluatingJavaScriptFromString:@"document.location.href"];
NSLog(@"currentURL==%@",currentURL);
4诈泼、//獲得UIWebView的標(biāo)題
NSString*theTitle=[webView stringByEvaluatingJavaScriptFromString:@"document.title"];
NSLog(@"theTitle==%@",theTitle);
5懂拾、//通過name(獲得/設(shè)置)頁面元素的value值
NSString*js_email_ByName = [webView stringByEvaluatingJavaScriptFromString:@"document.getElementsByName(‘email‘)[0].value=‘hello‘;"];
NSLog(@"js_email_ByName==%@",js_email_ByName);
NSString*js_password_ByName = [webView stringByEvaluatingJavaScriptFromString:@"document.getElementsByName(‘pwd‘)[0].value=‘hello‘;"];
NSLog(@"js_password_ByName==%@",js_password_ByName);
NSString*js_phone_ByName = [webView stringByEvaluatingJavaScriptFromString:@"document.getElementsByName(‘tel‘)[0].value=‘hello‘;"];
NSLog(@"js_phone_ByName==%@",js_phone_ByName);
6、//通過id(獲得/設(shè)置)頁面元素的value值
NSString*js_email_ById = [webView stringByEvaluatingJavaScriptFromString:@"document.getElementByIdx_x_x(‘_iphone_email‘).value=‘a(chǎn)sdfasdf‘;"];
NSLog(@"js_email_ById==%@",js_email_ById);
NSString*js_password_ById = [webView stringByEvaluatingJavaScriptFromString:@"document.getElementByIdx_x_x(‘_iphone_pwd‘).value=‘a(chǎn)sdfasdf‘;"];
NSLog(@"js_password_ById==%@",js_password_ById);
NSString*js_phone_ById = [webView stringByEvaluatingJavaScriptFromString:@"document.getElementByIdx_x_x(‘_iphone_phone‘).value=‘a(chǎn)sdfasdf‘;"];
NSLog(@"js_phone_ById==%@",js_phone_ById);
7铐达、//提交表單NSString*js_forms = [webView stringByEvaluatingJavaScriptFromString:@"document.forms[0].submit(); "];
NSLog(@"js_forms==%@",js_forms);
8委粉、//獲得body與body之間的HTML
NSString*allHTML = [webView stringByEvaluatingJavaScriptFromString:@"document.body.innerHTML"];
NSLog(@"allHTML: %@", allHTML);
9、//使UIWebView的輸入框獲得焦點(但是無法,彈出iphone鍵盤)[webView stringByEvaluatingJavaScriptFromString:@"document.querySelector(‘#saySome‘).focus()"];
? ? [webView stringByEvaluatingJavaScriptFromString:@"document.getElementByIdx_x("saySome").scrollIntoView("true")"];
10娶桦、//改變webview尺寸時對應(yīng)改變web page尺寸(web page需要有對應(yīng)的處理)
[webview stringByEvaluatingJavaScriptFromString: [NSStringstringWithFormat:@"document.querySelector(‘meta[name=viewport]‘).setAttribute(‘content‘, ‘width=%d;‘, false);",(int)webview.frame.size.width]];
11贾节、//獲取webview顯示內(nèi)容的高度
CGFloat documentWidth = [[wb stringByEvaluatingJavaScriptFromString:@"document.getElementById(‘content‘).offsetWidth"] floatValue];
CGFloatdocumentHeight = [[wb stringByEvaluatingJavaScriptFromString:@"document.getElementById(\"content\").offsetHeight;"] floatValue];
12、//通過id獲取內(nèi)容
NSString*js =@"document.getElementById(‘lg‘).innerHTML";
NSString*pageSource = [webView stringByEvaluatingJavaScriptFromString:js];
NSLog(@"pagesource:%@", pageSource);
13衷畦、//改變字體大小
[self.webViewstringByEvaluatingJavaScriptFromString:@"document.getElementsByTagName(‘body‘)[0].style.webkitTextSizeAdjust= ’150%’"];
14栗涂、//改變webView中圖片大小
[webView stringByEvaluatingJavaScriptFromString:@"var script = document.createElement(‘script‘);""script.type = ‘text/javascript‘;""script.text = \"function ResizeImages() { ""var myimg,oldwidth;""var maxwidth = 300.0;"
// UIWebView中顯示的圖片寬度
"for(i=0;i maxwidth){"
"oldwidth = myimg.width;"
"myimg.width = maxwidth;"
"}"
"}""}\";
""document.getElementsByTagName(‘head‘)[0].appendChild(script);"];
15、//刪除所有鏈接
[webView stringByEvaluatingJavaScriptFromString:@"$(document).ready(function () {$(\"a\").removeAttr(\"href\");})"];
文/小兵快跑(簡書作者)
原文鏈接:http://www.reibang.com/p/4790c8a0317e
著作權(quán)歸作者所有斤程,轉(zhuǎn)載請聯(lián)系作者獲得授權(quán),并標(biāo)注“簡書作者”菩混。