这种情况我之前在项目里碰到过，核心问题大多是动态元素初始化时机不对或者TinyMCE的DOM挂载逻辑冲突导致的，给你几个可行的解决步骤：

1. 确保动态添加的TextArea有唯一ID #

TinyMCE是通过元素ID来绑定编辑器实例的，如果新添加的textarea和已有实例ID重复，就会出现挂载位置混乱的情况。所以Ajax返回的HTML里，每个textarea的ID必须是唯一的，比如可以用递增的数字或者随机字符串：

<!-- 示例：动态生成的带唯一ID的TextArea -->
<textarea id="editor-{{随机数/递增ID}}" name="content"></textarea>

2. 动态插入DOM后单独初始化新实例 #

不要依赖页面加载时的全局tinymce.init()，而是在Ajax请求成功、新元素插入DOM之后，针对这个新的textarea单独初始化：

// 假设你的Ajax请求代码
$.ajax({
  url: '/YourController/GetEditorPartial',
  success: function(html) {
    // 将新元素插入到目标容器（比如#new-editor-container）
    $('#new-editor-container').append(html);
    
    // 获取刚插入的textarea的ID
    var newEditorId = $('#new-editor-container textarea:last').attr('id');
    
    // 单独初始化这个新实例
    tinymce.init({
      selector: '#' + newEditorId,
      // 你的TinyMCE配置项，和页面加载时的保持一致
      plugins: 'advlist autolink lists link image charmap print preview',
      toolbar: 'undo redo | formatselect | bold italic | alignleft aligncenter alignright | bullist numlist outdent indent'
    });
  }
});

3. 避免重复初始化（可选但重要） #

如果你的页面可能多次执行Ajax添加操作，最好在初始化前检查一下该ID对应的实例是否已经存在，防止重复初始化导致的异常：

if (!tinymce.get(newEditorId)) {
  tinymce.init({
    selector: '#' + newEditorId,
    // 配置项...
  });
}

4. 检查是否有CSS定位冲突 #

有时候位置偏移也可能是CSS的锅，比如父容器用了position: relative但TinyMCE的编辑器容器用了position: absolute，导致定位基准错误。可以检查一下TinyMCE生成的.tox容器的CSS，或者给动态添加的编辑器父容器加上明确的定位规则：

.editor-wrapper {
  position: relative;
  margin: 1rem 0;
}

按照这个流程来，基本就能解决动态添加时编辑器位置跑偏的问题了，我当时就是这么搞定的😉

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