如何阻止TinyMCE给列表新增的li元素自动继承原有类名

这个现象是TinyMCE lists插件的默认行为：新增列表项时会自动继承上一个li的所有属性，包括类名。你可以通过编辑器的事件监听实现需求，不需要全局禁用li类名，已手动添加的类名也不会受影响：

在你的TinyMCE初始化配置中加入setup钩子即可：

tinymce.init({
  selector: 'textarea', // 替换为你实际的编辑器选择器
  plugins: 'lists',
  // 其他原有配置保持不变
  setup: function (editor) {
    // 监听回车事件，处理列表内新增的li
    editor.on('keydown', function (e) {
      if (e.key === 'Enter') {
        const currentLi = editor.selection.getNode().closest('li');
        if (currentLi) {
          // 等待默认插入行为执行完成后处理新li
          setTimeout(() => {
            const newLi = editor.selection.getNode().closest('li');
            if (newLi) {
              // 全清类名用这个
              newLi.removeAttribute('class');
              // 如果只需要删除特定类，比如你用到的optional，用下面这行替换上面的即可
              // newLi.classList.remove('optional');
            }
          }, 0);
        }
      }
    });
  }
});

如果有除了回车之外的其他新增li的场景，可以再加一层NodeChange事件兜底，只会处理刚生成的空li，不会改动已有内容：

// 加在setup函数内部即可
editor.on('NodeChange', function (e) {
  const targetLi = editor.selection.getNode().closest('li');
  if (targetLi && targetLi.textContent.trim() === '') {
    targetLi.removeAttribute('class');
  }
});

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