將TinyMCE添加到我的動態表格中

Question

我有一個想法可以幫助我更好地工作，併爲自己創建工具以更快地工作。 我打算製作文檔以將我的QA工作保存到數據庫和我的服務器。 到目前爲止，在我的本地工作的所有工作，但與我坐在一起的問題是，我想使用的TinyMCE編輯器無法正常工作。

我有一個動態表添加到我的表單，可以幫助我添加和刪除我的表單中的行。在其中的一個專欄中，我添加了TinyMCE編輯器來描述我用我的qa測試完成的過程。我已經添加了標籤「」，但是當我想添加另一行時，編輯器已停止工作。我想知道我能做些什麼來創建一個新的行，但仍然能夠在EACK列中的編輯工作/行

<fieldset class="row2"> 
       <legend>Process</legend> 
       <p> 
        <input type="button" value="Add Row" onClick="addRow('dataTable')" /> 
        <input type="button" value="Remove Row" onClick="deleteRow('dataTable')" /> 
        <p>(All acions apply only to entries with check marked check boxes only.)</p> 
       </p> 
       <table id="dataTable" class="form" border="1"> 
        <tbody> 
        <tr> 
         <p> 
         <td><input type="checkbox" required="required" name="chk[]" checked="checked" /></td> 
         <td> 
          <label>Name</label> 
          <input type="text" required="required" name="BX_STEP[]"> 
         </td> 
         <td> 
          <label for="BX_process">Age</label> 
          <textarea type="text" required="required" class="small" name="BX_process[]"></textarea> 
         </td> 

         <td> 
          <label for="BX_pass-fail">Gender</label> 
          <select id="BX_pass-fail" name="BX_pass-fail" required="required"> 
           <option>....</option> 
           <option>Pass</option> 
           <option>Fail</option> 
          </select> 
         </td> 
         <td> 
          <label for="BX_comment">Berth Pre</label> 
          <input id="BX_comment" name="BX_comment" required="required"> 
         </td> 
         </p> 
        </tr> 
        </tbody> 
       </table> 
       <div class="clear"></div> 
      </fieldset> 


<script src="//tinymce.cachefly.net/4.2/tinymce.min.js"></script> 
    <script>tinymce.init({selector:'textarea'});</script> 

我只是想知道如何爲每一個新的文本編輯器排我添加？

Answer 1

我想你需要獨立初始化每個textarea s。例如：

<script> 
    tinymce.init({selector:'#ta1'}); 
    tinymce.init({selector:'#ta2'}); 
</script> 
<h1>My First Text Area</h1> 
<textarea id="ta1">Hello! Look at me, I'm an editable textarea!</textarea> 
<h1>My Other Text Area</h1> 
<textarea id="ta2">Whoa! Now there are two of us!</textarea> 

見我的jsfiddle：https://jsfiddle.net/wr8rh6b8/

您可能還需要在選擇閱讀起來。相同的選擇器語法用於CSS並用於識別JavaScript代碼中的DOM元素。見：