所见即所得编辑器不适用于通过ajax php调用生成的文本区域


WYSIWYG editor does not work on textarea that are generated through ajax-php calls

我有一个文本区域,我正在用ajax生成它,但在加载文本区域后,该文本区域不会转换为所见即所得编辑器,但它在正常的文本区域上工作,请帮助解决我的问题。

<!DOCTYPE html>
<html>
<head>
........
$.ajax({
        type: "POST",
        url: "<?php echo base_url(); ?>" + "dashboard/show_data",
        cache: false,
        dataType: "json", 
        success: function(data){
        $('#demo').html(data);
........
<script src="//tinymce.cachefly.net/4.2/tinymce.min.js"></script>
<script>tinymce.init({selector:'textarea'});</script>
</head>
<body>
    <textarea>Easy! You should check out MoxieManager!</textarea>
    <section id="demo">
    </section>
</body>
</html>

show_data.php

<textarea></textarea>

问题是在执行ajax成功函数时,tinymce编辑器已经初始化。

解决这个问题很容易。你只需要在成功时初始化新的编辑器:

$.ajax({
        type: "POST",
        url: "<?php echo base_url(); ?>" + "dashboard/show_data",
        cache: false,
        dataType: "json", 
        success: function(data){
          $('#demo').html(data);
          //put the initial init function here instead
          tinymce.init({selector:'textarea'});
          // **or** better in case you know the textarea id use
          tinymce.init({ selector: "#textarea_id" });
........

尝试添加此

tinymce.init({selector:'textarea'});

在您将HTML放入演示元素之后。否则谷歌如何使用jQuery on。你的问题是mce编辑器需要绑定到新的dom元素,如果你不告诉它,它就不会绑定。