求助：tinymce.init({selector:'textarea'})在AJAX POST后无法正常工作

我之前也碰到过类似的情况，核心问题在于你调用tinymce.init()的时机不对，加上动态DOM替换带来的实例冲突。下面给你几个可行的解决办法：

原因分析 #

你用$("#load_comment").load(" #load_comment")重新加载内容时，这个操作是异步的——也就是说，你写完这句代码后，浏览器还在后台请求并渲染新内容，而你紧接着调用tinymce.init()的时候，新的<textarea>根本还没被插入到DOM里，TinyMCE自然找不到要初始化的元素。另外，如果页面之前已经有TinyMCE实例，新元素加载后还可能出现实例冲突的问题。

解决方案 #

方案一：把初始化放在load的回调里（最基础的修复） #

load()方法支持传入一个回调函数，这个函数会在内容加载完成、DOM更新完毕后执行。把TinyMCE的初始化代码放到这里面，就能确保目标元素已经存在：

$.ajax({
    type: "POST",
    url: "insert_comment.php",
    data: {p_id:p_id,full_name:full_name,email:email,content:content,img:img},
    dataType: "JSON",
    success: function(response) {
        $("#load_comment").load(" #load_comment", function() {
            // 等DOM更新完再初始化
            tinymce.init({selector:'textarea'});
        });
    }
});

方案二：先销毁旧实例再初始化（避免冲突） #

如果页面上原本就有TinyMCE编辑器，重新初始化可能会和旧实例冲突，导致新编辑器无法正常加载。这时候可以先销毁所有现有实例，再重新初始化：

$.ajax({
    type: "POST",
    url: "insert_comment.php",
    data: {p_id:p_id,full_name:full_name,email:email,content:content,img:img},
    dataType: "JSON",
    success: function(response) {
        $("#load_comment").load(" #load_comment", function() {
            // 销毁所有已存在的TinyMCE实例
            tinymce.remove();
            // 重新初始化所有textarea
            tinymce.init({selector:'textarea'});
        });
    }
});

方案三：针对新元素单独初始化（更高效） #

如果你只想初始化新加载出来的<textarea>，而不是全局所有的，可以直接获取新元素后用addEditor方法单独初始化，这样性能更好：

$.ajax({
    type: "POST",
    url: "insert_comment.php",
    data: {p_id:p_id,full_name:full_name,email:email,content:content,img:img},
    dataType: "JSON",
    success: function(response) {
        $("#load_comment").load(" #load_comment", function() {
            // 定位到新加载的textarea
            const newTextarea = $("#load_comment textarea")[0];
            if (newTextarea) {
                // 针对该元素初始化编辑器
                tinymce.addEditor(newTextarea, {
                    // 这里可以添加你的自定义配置，比如：
                    // toolbar: 'bold italic underline',
                    // menubar: false
                });
            }
        });
    }
});

你可以根据自己的实际场景选择其中一种方案，一般方案一就能解决大部分问题，如果有实例冲突的情况再用方案二或三。

内容的提问来源于stack exchange，提问作者Omkar Patil