リッチテキストエディターを表示する

書式

editorObj = new YAHOO.widget.Editor(editorID, option)

editorObj : エディターオブジェクト
editorID : エディターID
option : オプション【省略可能】

説明

リッチテキストエディターを表示するにはYAHOO.widget.Editor()を使います。あらかじめ、textareaタグで入力エリアを用意しておきます。textareaにname属性とID属性を指定し同じ名前を指定しておきます。YAHOO.widget.Editor()の最初のパラメータにリッチテキストエディターを表示するtextareaタグのID名を指定します。2番目のパラメータはオプションでリッチテキストエディターのサイズなどを指定します。2番目のパラメータはオプションで省略することができます。
リッチテキストエディターを表示するには各種スタイルシートファイルを読み込ませます。また、bodyタグにはclass="yui-skin-sam"を指定する必要があります。
Ajaxライブラリ リファレンス

サンプルコード [実行]

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title>Sample</title>
<link rel="stylesheet" type="text/css" href="css/fonts/fonts.css">
<link rel="stylesheet" type="text/css" href="css/container/assets/skins/sam/container.css">
<link rel="stylesheet" type="text/css" href="css/menu/assets/skins/sam/menu.css">
<link rel="stylesheet" type="text/css" href="css/button/assets/skins/sam/button.css">
<link rel="stylesheet" type="text/css" href="css/editor/assets/skins/sam/editor.css">
<link rel="stylesheet" type="text/css" href="main.css">
<script type="text/javascript" src="yui/utilities.js"></script>
<script type="text/javascript" src="yui/container.js"></script>
<script type="text/javascript" src="yui/menu.js"></script>
<script type="text/javascript" src="yui/button-beta.js"></script>
<script type="text/javascript" src="yui/editor-beta.js"></script>
<script type="text/javascript"><!--
window.onload = function(){
editorObj = new YAHOO.widget.Editor("userComment", {
height: "240px",
width: "320px",
dompath: true,
animate: true
});
editorObj.render();
}
// --></script>
</head>
<body class="yui-skin-sam">
<h1>Sample</h1>
<form>
<textarea name="userComment" id="userComment" cols="50" rows="10">
ご意見をお願いします。
</textarea>
</form>
</body>
</html>