javascript - TinyMCE 替换父节点

Question

我正在开发一个 WordPress 插件，它向 TinyMCE 编辑器添加一个按钮。单击该按钮时所需的行为应该是: 1. 如果所选文本不是短代码的一部分(或者是短代码)，则应将短代码插入到 DOM 中。 2 如果不是，则应将短代码替换为新的。

第一个要求已满足，但第二个要求未满足。插入后，它会显示在可视化编辑器中，但在保存或切换到文本时不会保存或显示。这让我相信我并没有直接编辑编辑器下的对象，而是直接编辑显示的对象。正确的方法是什么。请看下面的函数:

...

  insertContent: function(){
    var atts  = '';
    var node  = tinyMCE.activeEditor.selection.getNode();
    var edit  = $(node).is('div.wp-arv-faq');

    jQuery('./$p/-sc-input').each(function() {
      atts = atts + jQuery(this).attr('name') + '=\"' + $(this).val() + "\" ";
    });

    var caption   = 'F.A.Q. ' + $('./$p/-sc-input[name="tax"] option:selected').text();
    var style     = $('./$p/-sc-input[name="style"] option:selected').text();
    atts += ' caption="' + caption + ' (' + style + ')"';

    if (edit){
      $(node).empty();

      tinyMCE.activeEditor.selection.setContent('[arv-faq ' + atts + '][/arv-faq]');      




    /$p/faqMCE.closeModal();
  },
...

请注意，“/$p/”对于我的构建过程来说是唯一的，应该被忽略。提前致谢

Answer 1

从你的问题来看，并不完全清楚你想要做什么，但我猜你正在尝试将 html 代码插入编辑器。

确保在调用$(node).empty();后立即设置选择

注意:您的所有标签和属性都需要使用 valid_elements 和 valid_children 配置参数配置为允许的标签和属性。