通過接近N天的努力. 終于在今天.IOS下內(nèi)嵌HTML編輯器的Demo 基本實現(xiàn).學(xué)習(xí)過程中,參考了很多網(wǎng)上的資料.很感謝這些分享資源的牛人.有你們才能順利拿下這個比較特別的需求.
過程中找到兩個比較好的HTML編輯器是ZSSRichTextEditor 和CKEditor，下面我會簡單的介紹這兩款HTML編輯器缚去；途中難點在于,如何與內(nèi)嵌HTML編輯器進(jìn)行數(shù)據(jù)交互,接下來,進(jìn)入正題：
ZSSRichTextEditor
ZSSRichTextEditor 是個漂亮的iOS富文本W(wǎng)YSIWYG所見即所得的編輯器，它包含了一個標(biāo)準(zhǔn)WYSIWYG編輯器所應(yīng)該擁有的所有工具，此外還提供源代碼語法高亮查看功能。
ZSSRichTextEditor-1.gif
ZSSRichTextEditor--2.gif
CKEditor
CKEditor 是當(dāng)前最為知名的 HTML 編輯器眯分，它具有所有主流 HTML 編輯器所應(yīng)當(dāng)具備的特點：所見即所得比勉、簡單易用、開源并支持各種主流的瀏覽器（IE琼锋、Oper、FireFox祟昭、Chrome缕坎、Safari）。最重要的是篡悟，CKEditor 經(jīng)過 10 年的不斷完善和更新谜叹，其穩(wěn)定性和兼容性已經(jīng)不容質(zhì)疑。
CKEditor--1.png
主要過程：
小兵用的是ZSSRichTextEditor HTML編輯器
1）利用UIWebView 內(nèi)嵌HTML編輯器實現(xiàn)IOS下用戶可以進(jìn)行富文本編輯恰力；主要目的是保證服務(wù)端的內(nèi)容值不丟失.亦可在移動端對內(nèi)容進(jìn)行一些簡單的修改.
ZSSRichTextEditor--3.png
2）加載本地的html文件
[self.webView setUserInteractionEnabled:YES];//是否支持交互
[self.webView setOpaque:NO];//opaque是不透明的意思
[self.webView setScalesPageToFit:YES];//自動縮放以適應(yīng)屏幕
NSString* path = [[NSBundle mainBundle] pathForResource:@"11" ofType:@"html"];
NSURL* url = [NSURL fileURLWithPath:path];
// NSString *str = @"http://192.168.5.120:7293/6.html";
// NSURL *url = [NSURL URLWithString:str];
NSURLRequest* request = [NSURLRequest requestWithURL:url] ;
[self.webView loadRequest:request];
3)在UIWebView的代理方法-(void)webViewDidFinishLoad:(UIWebView *)webView中提取html頁面元素叉谜，跳轉(zhuǎn)到編輯頁面
-(void)webViewDidFinishLoad:(UIWebView *)_webView{
NSLog(@"123");
NSString *strings1 = [self.webView stringByEvaluatingJavaScriptFromString:@"document.body.innerHTML"];
// 這里獲得的strings為word文檔內(nèi)容的html格式。
// NSLog(@"%@--askl",strings);
indestr_body = [NSString stringWithFormat:@"<body>%@</body>",strings1];
4）提取HTML數(shù)據(jù)到編輯器
ZSSRichTextEditor--4.png
到此大功告成踩萎；
擴(kuò)展:js與webview 常用交互代碼
常用JS語句：：：
1停局、 //禁用用戶選擇
[self.webView stringByEvaluatingJavaScriptFromString:@"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: [NSString stringWithFormat:@"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];
CGFloat documentHeight = [[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.webView stringByEvaluatingJavaScriptFromString:@"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 <document.images.length;i++){"
"myimg = document.images[i];"
"if(myimg.width > maxwidth){"
"oldwidth = myimg.width;"
"myimg.width = maxwidth;"
"}"
"}"
"}\";"
"document.getElementsByTagName(‘head‘)[0].appendChild(script);"];
15、//刪除所有鏈接
[webView stringByEvaluatingJavaScriptFromString:@"$(document).ready(function () {$(\"a\").removeAttr(\"href\");})"];
