CKeditor with multible dynamic textareas

Question

我有一個允許多個步驟提交的表單。當用戶點擊「添加步驟」時，會出現另一個文本區域。我正在使用CKeditor。它在第一次迭代中效果很好，但在隨後的所有版本中，它顯示了一個標準文本區域。這裏是我的代碼：

<form method="post" action="process_project.php"> 
<b>Steps for your project:</b> 
<div>&nbsp;</div> 
Step 1 
<div id="divWho"> 
<textarea name="projSteps[]" class="steps" id="1" rows="10" cols="60"></textarea> 
</div> 
<div>&nbsp;</div> 
<input type="button" value="Add project step" onClick="addTextArea();"> 
<input type="submit" name="submit" value="submit" /> 
</form> 


<script type="text/javascript"> 
var counter = 1; 
var limit = 11; 
function addTextArea() { 
if (counter == limit-1) { 
alert("You have reached the limit of adding " + counter + " project steps"); 
return false; 
} 
else { 
var newdiv = document.createElement('div'); 
newdiv.innerHTML = "Step " + (counter + 1) + " <br><textarea name='projSteps[]' id=counter rows='10' cols='60'>"; 
document.getElementById('divWho').appendChild(newdiv); 
counter++ 
return true; 
} 
} 
</script> 
<script> CKEDITOR.replace('1');</script> 

我怎樣才能使每個新的動態創建的文本區域也使用CKeditor？我一直在努力工作好幾個小時，我很難過。

Answer 1

我認爲你需要移動CKEDITOR.replace（'1'）;在return語句之前else塊中的addTextArea（）方法內。

而且，如果您將替換參數硬編碼爲'1'，則它只會將第一個id爲1的textarea實例轉換爲CKEditor並忽略其他參數。動態生成一個Id並將其傳遞給repalce方法。像下面這樣，

var step = 'step'+counter; 

div = <textarea name='projSteps[]' id=step rows='10' cols='60'>; 

CKEDITOR.replace(step); 

我還沒有寫完第二步，我想你可以根據需要修改它。

我正在研究類似的功能，這種方法適用於我。