数日前、私はブログの挿入コードを使いやすいと感じました。そのため、SinaのHTMLエディターはTinymceに置き換えられました。コードの簡単な挿入が開発されました。 。 。以下は私の開発プロセスです。
まず、私のTinymceバージョンはバージョン：3.2.7（2009-09-22）です。
Tinymce挿入コードでは、Tinymce.execcommand（ 'mceinsertcontent'、false、value）を呼び出す必要があります。 Tinymceの方法。パラメーターを変更する必要はありません。値は挿入したいものです。
たとえば、私は関数を書きました、
コードコピーは次のとおりです。
関数inserthtml（value）
{
tinymce.execcommand（ 'mceinsertcontent'、false、value）;
}
後で、この例では、ダウンロードが提供されます。例で。合計には3つのドキュメントがあります。
tinymce.html insertcode.php save.phpこれら3つのファイル。
tinymce.htmlは、Tinymceテキストボックスページです。
メインコードは次のとおりです。
コードコピーは次のとおりです。
<スクリプトタイプ= text/javascript src = http：//www.vevb.com/tinymce/tiny_mce.js> </script>
<script type = text/javascript>
tinymce.init（{
//一般的なオプション
convert_urls：false、
モード：正確、
要素：article_content、
//モード：textareas、
テーマ：Advanced、
プラグイン：サファリ、ページブレイク、スタイル、レイヤー、テーブル、保存、アドバイス、アドヴィマージ、アドバリンク、感情、inlinePopups、insertDateTime、プレビュー、メディア、検索録画、印刷、コンテキストメン、ペースト、方向性、フルスクリーン、非視覚、視覚障害者、xhtmlxtras、Wordcount、breaks
//テーマオプション
theme_advanced_buttons1：save、newdocument、|、bold、yatalic、underline、strikethrough、|、justifyleft、justifycenter、justifylight、justifyfull、styleSelect、formatselect、fontselect、fontsizeSelect、fontsizeSelect、
theme_advanced_buttons2：カット、コピー、ペースト、パステキスト、パステワード、|、検索、置換、交換、|、ブリスト、numlist、|、autdent、indent、blockquote、|、undo、redo、|、link、link、アンカー、画像、クリーンアップ、コードなど
theme_advanced_buttons3：Tablecontrols、|、Hr、removeformat、visualaid、|、sub、sup、|、charmap、emotions、iespell、media、advhr、|、print、|、ltr、rtl、|、fullscreen、
theme_advanced_buttons4：insertlayer、moveforward、movingbackward、absolute、|、styleprops、|、cite、abbr、頭字語、del、ins、attribs、|、visualchars、nonbreaking、テンプレート、ページブレイク、
theme_advanced_toolbar_location：top、
theme_advanced_toolbar_align：左、
theme_advanced_statusbar_location：bottom、
theme_advanced_resizing：true、
//コンテンツの例CSS（サイトCSSである必要があります）
content_css：css/content.css、
//リンク/画像/メディア/テンプレートダイアログのリストをドロップします
template_external_list_url：lists/template_list.js、
external_link_list_url：lists/link_list.js、
external_image_list_url：lists/image_list.js、
media_external_list_url：lists/media_list.js、
//テンプレートプラグインの値を交換します
template_replace_values：{
ユーザー名：一部のユーザー、
StaffID：991234
}
}）;
</script>
<script type = text/javascript>
関数inserthtml（value）
{
tinymce.execcommand（ 'mceinsertcontent'、false、value）;
}
</script>
ここで、JSコードはTinymceを初期化することです。ダウンロードの例にはTinymceが含まれていません。自分でダウンロードする必要があります。次に、JSコードのSRCを変更します。
コードコピーは次のとおりです。
<入力名=ボタンタイプ=ボタンonclick = window.open（ 'insertcode.php'、 'insert code'、 'height = 500、width = 600、top = 300、left = 300、toolbar = no、no、no、scrollbars = no、recizable = no、no、no、no = no'）価値
上記のコードは、insertCode.phpファイルを開くために使用されます。
次に、InsertCodeを見てみましょう。このファイルのコード。
まず、JSコード
コードコピーは次のとおりです。
<スクリプト言語= javascript src = http：//www.gosoa.com.cn/js/jquery.js> </script>
<スクリプト言語= javascript>
関数insertCode（）
{
var value = $（ '＃postcontent'）。html（）;
var codetype = $（ '＃codetype'）。val（）;
// window.opener.inserthtml（ '<textarea rows = 3 cols = 50 name = code class ='+codetype+'>'+value+'</textarea>'）;
window.opener.inserthtml（ '<pre name = code class ='+codetype+'>'+value+'</pre>'）;
window.close（）;
}
</script>
次はPHPおよびHTMLコードです
コードコピーは次のとおりです。
<？php
error_reporting（0）;
$ content = $ _post ['content'];
if（！empty（$ content））
{
$ codetype = $ _post ['codetype'];
echo '<div id = postcontent>';
$ content = htmlspecialchars（$ content）;
echo $ content;
echo '</div>
<入力タイプ=非表示名= codetype id = codetype value = '。$ codetype。' />
<入力型=ボタン名=送信値= onclick = insertCode（）style = border：1px solid＃000;ラインハイト：18px;幅：60px;/> ';
}それ以外
{
？>
<divスタイル=マージン：0 auto>
<form id = form1 name = form1 method = post action = insertcode.php>
<label>挿入するコードの種類を選択します
<name = codetype id = codetype>を選択します
<オプション値= 'php'> php </option>
<オプション値= 'js'> js </option>
<オプション値= 'html'> html </option>
<オプション値= 'c'> c </option>
<オプション値= 'ASP'> ASP </option>
<オプション値= 'xml'> xml </option>
<オプション値= 'java'> java </option>
<オプション値= 'java'> java </option>
<オプション値= 'csharp'> c＃</option>
<オプション値= 'sql'> sql </option>
</select>
</label>
<label>
<textarea name = content id = content cols = 30行= 20 style = width：600px;高さ：200px;ボーダー：1pxダッシュ＃333> </textarea>
</label>
<p>
<ラベルスタイル=パディング左：50px;>
<入力タイプ=送信name = submit value = submit style = border：1px solid＃000;ラインハイト：18px;幅：60px;/>
</label>
</p>
<p> </p>
</form>
</div>
<？php
}
？>
insertCode.phpでは、insertCode（）関数を使用して、tinymce.htmlページのinserthtml（）関数を呼び出し、tinymce.htmlページにコードを挿入します。
コードでは、なぜ '+value+'が必要なのですか？
ページを表示しているため、SynTaxhighlighterプラグインを使用してコードを強調表示します。
ここで説明するもう1つのポイント、$ content = htmlspecialchars（$ content）;コード自体のHTMLSpecialCharsエスケープ操作を実行しました。このようにして、データベースに挿入されたコードは安全です。
OK、save.phpをもう一度見てみましょう。このページは、提出されたコンテンツを表示するために使用されます。
メインコードは次のとおりです。
コードコピーは次のとおりです。
<？
$ article_content = $ _post ['article_content'];
関数トランスコード（$ str）
{
if（empty（$ str））
{
falseを返します。
}
$ str = str_replace（ ''、 ''、$ str）;
$ str = str_replace（ ''、 ''、$ str）;
$ str = str_ireplace（ '<br>'、n、$ str）;
$ str = str_ireplace（ '<pre'、 '<pre name = code'、$ str）;
$ strを返します。
}
Echo Transcode（$ article_content）;
？>
<スクリプトclass = javascript src =/tinymce/lightcode/scripts/shcore.js> </script>
<スクリプトclass = javascript src =/tinymce/lightcode/scripts/shbrushcsharp.js> </scrip>
<スクリプトclass = javascript src =/tinymce/lightcode/scripts/shbrushphp.js> </scrip>
<スクリプトclass = javascript src =/tinymce/lightcode/scripts/shbrushjscript.js> </scrip>
<スクリプトclass = javascript src =/tinymce/lightcode/scripts/shbrushjava.js> </scrip>
<スクリプトclass = javascript src =/tinymce/lightcode/scripts/shbrushvb.js> </scrip>
<スクリプトclass = javascript src =/tinymce/lightcode/scripts/shbrushsql.js> </scrip>
<スクリプトclass = javascript src =/tinymce/lightcode/scripts/shbrushxml.js> </scrip>
<スクリプトclass = javascript src =/tinymce/lightcode/scripts/shbrushdelphi.js> </script>
<スクリプトclass = javascript src =/tinymce/lightcode/scripts/shbrushpython.js> </scrip>
<スクリプトclass = javascript src =/tinymce/lightcode/scripts/shbrushruby.js> </scrip>
<スクリプトclass = javascript src =/tinymce/lightcode/scripts/shbrushcss.js> </script>
<スクリプトclass = javascript src =/tinymce/lightcode/scripts/shbrushcpp.js> </scrip>
<スクリプトclass = javascript>
dp.syntaxhighlighter.highlightall（ 'code'）;
</script>
わかりました、それは終わりました。