最近公司要做一個(gè)論壇類的app,有一個(gè)類似簡書發(fā)布文章的富文本編輯器功能,于是各種百度谷歌,最終決定使用ZSSRichTextEditor這個(gè)庫,當(dāng)然使用過程中遇到了很多問題.

1.當(dāng)內(nèi)容輸入多的時(shí)候,內(nèi)容超過鍵盤,就會(huì)不顯示.

分析了一下原因,因?yàn)閏ontentHeight高度過高,導(dǎo)致被鍵盤覆蓋內(nèi)容無法顯示,那么我看下ZSSRichTextEditor的demo,在鍵盤升起的監(jiān)聽方法中可以看到

[self setFooterHeight:(keyboardHeight -8)];

[self setContentHeight: self.editorViewFrame.size.height];

作者之所以要給footer設(shè)置一個(gè)高度就是為了撐起一個(gè)鍵盤高度,我們只需要將contentHeight值減小即可,比如我們減100的高度

[self setContentHeight: self.editorViewFrame.size.height - 100];

這是我們發(fā)現(xiàn)就可以正常顯示了.

2.當(dāng)插入圖片時(shí),圖片過大不超出屏幕

我們只需要在插入圖片的js方法中在標(biāo)簽中插入內(nèi)嵌式的css樣式即可

zss_editor.insertImage =function(url, alt) {

? ? zss_editor.restorerange();

? ?var html = '<img src="' + url + '" alt="' + alt + '" style="width:100% !important;"/>';

? ? zss_editor.insertHTML(html);

? ? zss_editor.enabledEditingItems();

}

3.增加標(biāo)題輸入框

在editor.html中加入輸入框

? ? ? ? <input style="border:none;border-bottom: 1px dashed red;width:100%;height:44px;font-size:20px;" id="article_title" maxlength="35" type="text" placeholder="請(qǐng)輸入標(biāo)題">

獲取標(biāo)題值

-(NSString*)getTitle{

? ? NSString *htmlNum = @"document.getElementById('article_title').value";

? ? NSString *numHtmlInfo = [self.editorView stringByEvaluatingJavaScriptFromString:htmlNum];

? ? returnnumHtmlInfo;

}

4.分割線間距太小

zss_editor.setHorizontalRule方法替換為一下方法

zss_editor.setHorizontalRule =function() {

? ? //? ? document.execCommand('insertHorizontalRule', false, null);

? ? varhr_html ="<br />"+'<hr />'+"<br />";

? ? document.execCommand('insertHTML',false, hr_html);

? ? zss_editor.enabledEditingItems();

}