jQueryエディタKindEditor4.1.4のコードハイライト設定tutorial_jquery

KindEditor 公式 Web サイト: http://www.kindsoft.net/

1. ロードする必要がある JS および CSS ファイルは次のとおりです:

コピーcode コードは次のとおりです:

🎜>

2.エディターが初期化されて設定され、中に prettyPrint() を追加します:

コードをコピー コードは次のとおりです:

KindEditor.ready(function ( K) {
window.EditorObject = K.create('#txtBody', {
cssPath: 'plugins/code/prettify.css',
resizeType: 1 、
allowPreviewEmoticons: false、
allowImageUpload: false、
items: [
'code'、'fontname'、'fontsize'、'|'、'forecolor'、'hilitecolor'、'bold ', 'italic', 'underline' 、
'removeformat'、'|'、'justifyleft'、'justifycenter'、'justifyright'、'insertownedlist'、
'insertunownedlist'、'|'、'emoticons ', 'image', 'link' ]
});
prettyPrint()
});

強調表示されるコードが最初は非表示になっている場合表示するには、 prettyPrint( ; id = '#divBody' i;
if($(id).is(":hidden")){
$('#divIntro' i).hide を呼び出す必要があります。 ();

$(id) .slideDown(); $(id).next("a").text("Shrink..."); } else{ $ ('#divIntro' i).show(); $(id).slideUp(); $(id).next("a").text ("詳細..."); }

}

3. デフォルトのコードでは行を自動的に折り返さないようにするには、prettify.css を変更します。プリラップへのホワイトスペースの元の値:



コードをコピー


コードは次のとおりです:


pre.prettyprint {
ボーダー: 0;
ボーダー左: 3px ソリッド rgb(204, 204, 204);
パディング:

フォント-サイズ: 110%;
表示: ブロック;

フォントファミリー: "Consolas"、"Monaco"、"Courier New"、Courier、等幅: 1em 0px; white-space: pre-wrap; /* 値は pre;*/ }