2 つのリッチ テキスト エディターを必要とするページがあるため、WYSIWYG (What You See Is What You Get) を使用しました。少し厄介な詳細を除いて、それらは正常に機能します。ボタンをクリックして太字、斜体、またはインデントすると、両方の RTE に適用され、2 番目の入力に焦点が当てられます。ツールバーを互いに分離する方法がよくわかりません。
HTML:
<div class="form-group">
<label for="definition" class="col-lg-3 control-label">Definition:</label>
<div class="col-lg-3">
<div class="btn-toolbar" data-role="editor-toolbar" data-target="##definition">
<div class="btn-group">
<a class="btn" data-edit="bold" title="Bold (Ctrl/Cmd+B)"><i class="icon-bold"></i></a>
<a class="btn" data-edit="italic" title="Italic (Ctrl/Cmd+I)"><i class="icon-italic"></i></a>
</div>
<div class="btn-group">
<a class="btn" data-edit="insertunorderedlist" title="Bullet list"><i class="icon-list-ul"></i></a>
<a class="btn" data-edit="insertorderedlist" title="Number list"><i class="icon-list-ol"></i></a>
<a class="btn" data-edit="outdent" title="Reduce indent (Shift+Tab)"><i class="icon-indent-left"></i></a>
<a class="btn" data-edit="indent" title="Indent (Tab)"><i class="icon-indent-right"></i></a>
</div>
</div>
<div id="definition"></div>
</div>
</div>
<div class="form-group">
<label for="consent" class="col-lg-3 control-label">Consent:</label>
<div class="col-lg-3">
<div class="btn-toolbar" data-role="editor-toolbar" data-target="##consent">
<div class="btn-group">
<a class="btn" data-edit="bold" title="Bold (Ctrl/Cmd+B)"><i class="icon-bold"></i></a>
<a class="btn" data-edit="italic" title="Italic (Ctrl/Cmd+I)"><i class="icon-italic"></i></a>
</div>
<div class="btn-group">
<a class="btn" data-edit="insertunorderedlist" title="Bullet list"><i class="icon-list-ul"></i></a>
<a class="btn" data-edit="insertorderedlist" title="Number list"><i class="icon-list-ol"></i></a>
<a class="btn" data-edit="outdent" title="Reduce indent (Shift+Tab)"><i class="icon-indent-left"></i></a>
<a class="btn" data-edit="indent" title="Indent (Tab)"><i class="icon-indent-right"></i></a>
</div>
</div>
<div id="consent"></div>
</div>
</div>
JS (実際には必要ありませんが、念のため...)
$(function() {
$("#definition, #consent").wysiwyg();
})