将tinyMCE添加到多个动态创建的文本区

Question

我有一个动态创建的文本区列表，其中包含内容。以下是我如何检索数据并动态创建textareas。

$(document).ready(function(){ 

$('#btn').click(function(){ 
    var fullurl = $('#hiddenurl').val(); 
    var str = $('#email').val(); 
    $.post(fullurl, { 
     sendValue : str 
    }, function(data) { 
     var table_output = '<table><thead><tr><th>Name</th><th>Email</th></tr></thead>'; 
    $.each(data, function(i, d) { 
     table_output += '<tr><td>'+d.Name+'</td><td>'+d.Email+'</td></tr>'; 
     output += '<tr><td colspan="2"><textarea name="description" id="desc_'+d.ID+'" class="desc">'+d.Description+'</textarea></td></tr>';    

     tinyMCE.init({ 
      mode : "exact", 
      elements : 'desc_'+d.ID, 
      theme_advanced_buttons1 : "mylistbox,mysplitbutton,bold,italic,underline,separator,strikethrough,justifyleft,justifycenter,justifyright,justifyfull,bullist,numlist,undo,redo,link,unlink", 
      theme_advanced_buttons2 : "", 
      theme_advanced_buttons3 : "", 
      theme_advanced_toolbar_location : "top", 
      theme_advanced_toolbar_align : "left", 
      theme_advanced_statusbar_location : "bottom" 
     }); 

    }); 
table_output += '</table>'; 
$('#task_data_div').append(table_output); 

我试着实现上面显示的tinyMCE，但它似乎没有工作。任何人都可以在这里帮助我，也许可以指引我走向正确的方向。

谢谢。

Answer 1

为了简单起见，我不得不分解您的Ajax调用，但我的#btn单击处理程序将透明地放入您的成功处理程序中。

示范（的jsfiddle） http://jsfiddle.net/C59EW/

HTML

<button id="btn">button</button> 
<div id="show_data"></div> 

的Javascript（+ jQuery的，+ TinyMCE的）

$(document).ready(function() { 
    var data = [{ID:"1",Description:"text 1"}, {ID:"2",Description:"text 2"}]; 

    $('#btn').click(function() { 
     $.each(data, function(i, d) { 
      $('#show_data').append('<textarea name="description" id="desc_'+d.ID+'" class="desc">'+d.Description+'</textarea>'); 
      tinyMCE.init({ 
       mode : "exact", 
       elements : 'desc_'+d.ID, 
       theme_advanced_buttons1 : "mylistbox,mysplitbutton,bold,italic,underline,separator,strikethrough,justifyleft,justifycenter,justifyright,justifyfull,bullist,numlist,undo,redo,link,unlink", 
       theme_advanced_buttons2 : "", 
       theme_advanced_buttons3 : "", 
       theme_advanced_toolbar_location : "top", 
       theme_advanced_toolbar_align : "left", 
       theme_advanced_statusbar_location : "bottom" 
      }); 
     }); 
    }); 

});