、將富文本html內容轉換為純文本
formatrichtext = (richtext, len = 0) => {
let content = richtext.replace(/<.+?>/g, '');
content = content.replace(/ /ig, ''); /* 去除 */
content = content.replace(/\s/ig, ''); /* 去除空格 */
return content;
}
2、限制展示的文本長度
謂多行文本輸入控件,就是網頁表單中,因輸入內容較多需換行顯示的文本輸入控件,一般為textarea元素。很多富文本輸入框也是對textarea進行包裝。
<textarea name="Content" rows="8" style="width: 380px"></textarea>
多選文本輸入框
自動填寫多行文本輸入控件的五種方法
1、通過修改元素屬性填表
textarea元素比較特殊,在html中直接指定value屬性值是無效的。修改textarea元素的text屬性,可以實現自動填表,但要求textarea元素未被腳本賦值的情況下text才有效。修改text屬性不會觸發元素綁定的事件,但在木頭瀏覽器填寫項目中,可以明確指定填表前和填表后需要觸發的事件。
修改元素屬性
2、由系統向瀏覽器發送數據
在window系統下,這幾乎是一個萬能的方法,支持中文輸入,獲得控件元素后,填寫屬性設置為KeyboardSend。在自動輸入前,瀏覽器會自我激活為當前活動窗口,同時把輸入焦點轉移到設定的多行文本控件上。在輸入過程中,不能手工干預,不能讓控件失去焦點,也不能切換到別的程序窗口。輸入遠程會觸發控件綁定的事件代碼。
系統向瀏覽器發送內容
3、模擬人工鍵盤操作
獲取元素后,把填寫屬性設置為Keyboard,能達到人工按下實體鍵盤一樣的效果,因此不能輸入中文,執行時同樣會自動激活瀏覽器窗體,輸入焦點轉移到多選文本控件上。輸入過程中會觸發元素綁定的相關事件。
模擬人工按鍵
4、模擬鍵盤事件
在不按下鍵盤的情況下,直接產生按鍵事件作用于當前活動窗口,獲取元素后設置填寫屬性為KeyboardEvent。與模擬人工操作效果一樣,自動激活瀏覽器窗體,定位輸入焦點到多行文本控件上才能完成輸入,亦不支持中文輸入,會觸發元素控件綁定的腳本事件。
發送鍵盤事件
5、執行腳本代碼控制輸入
在項目管理窗口中,創建一個腳本代碼的步驟,執行JavaScript代碼修改textarea的value屬性值。注意:textarea雖然在html中沒有value屬性,但在JavaScript代碼中是支持的。不管textarea是否被賦初值,都不影響腳本執行填表效果。
document.getElementsByTagName("textarea")[0].value="木頭軟件";
也可以使用JQuery代碼,只要勾選【引入JQuery】,瀏覽器自動引用JQuery庫
$("textarea").eq(0).val("木頭軟件");
腳本填表多行文本框
執行以上腳本輸入內容后,不會觸發控件綁定的事件,如有必要,可以在代碼中主動調用相關的事件處理代碼。也可以再添加一個填表步驟項目來主動觸發事件代碼執行。
輯導語:如今越來越多的APP開始更新了深色模式,那么如何做好富文本在深色模式的適配呢?本篇文章主要總結了富文本的字體顏色在深色模式如何進行優化,希望對您有幫助。
自從19年蘋果發布會推出了深色模式后,越來越多的APP開始更新了深色模式,那么如何才能更好的適配深色模式呢?本文主要是總結一下富文本的字體顏色在深色模式上如何做優化。
富文本編輯器(Rich Text Editor,RTE)是一種可內嵌于瀏覽器,所見即所得的文本編輯器。它提供類似于Office Word 的編輯功能,方便那些不太懂HTML用戶使用。用戶是可以自己去設置文本的顏色、樣式、格式等。那么如果用戶在淺色模式下寫出了黑色的字,在深色模式應該怎么做適配呢?
首先來簡單了解一下顏色的構成方式,目前實際工作中比較常見的的幾種色彩模式有如下幾種:CMYK、RGB、HSB、HSL。
主要應用于平面印刷。
是工業界的一種顏色標準,是通過對紅(R)、綠(G)、藍(B)三個顏色通道的變化以及它們相互之間的疊加來得到各式各樣的顏色。
表示一種顏色模式:在 HSB 模式中,H(hues)表示色相,S(saturation)表示飽和度,B(brightness)表示亮度 HSB 模式對應的媒介是人眼。
是一種將 RGB 色彩模型中的點在圓柱坐標系中的表示法。H(hues)表示色相,S(saturation)表示飽和度,L(Lightness)表示亮度 。但 L(Lightness:亮度)與 B(Brightness:明度)分別被認為是「顏色中白色的量」和「顏色中光線的量」。
HSB 和 HSL在相同參數下,顏色差異還是挺大的。在設計上一般使用HSB模式,開發人員一般使用HSL,所以對于后面的分析,我們都采用HSL。
主要是找了一些文檔類垂直領域產品做一些相關的分析。
圖中淺色背景下的文字顏色是通過代碼查看,深色背景下的文字顏色是通過截圖吸取,所以存在微小誤差,但是可以大概看出:石墨文檔的顏色轉換規則:對于H=0的顏色(也就是灰度色)在深色模式下的轉換規則是:H不變,S=淺色S/2,L=80-淺色L。但對于H有數值的顏色在深色模式的轉換規則是:H不變,S=淺色S/2,L=100-淺色L。
可以看出石墨文檔對于富文本的處理做的很全面,不是簡單的進行顏色的反色,而是對于飽和度和明度都做了相應的處理,在深色模式下,顏色會偏暗一些,以減少眼睛疲勞。
使用了很偷懶的方法,里沒有對富文本做處理。
*請認真填寫需求信息,我們會在24小時內與您取得聯系。