如何在 tinyMCE 的源代码中获取复选框的选中状态？

Question

我将 tinyMCE 用作 html 编辑器，我想在我的代码中使用复选框，它们的切换状态保存在源代码中。

现在我只得到我在开始时定义的状态，而不是我在编辑器中切换它们之后的状态。

代码

这是我进入 tinyMCE 的代码，但在我切换复选框后新状态没有得到反映。

<textarea>
  <input type="checkbox" name="checkbox" id="checkbox2" checked="checked" /> <label for="checkbox">check</label>
  <br />
  <input type="checkbox" name="checkbox" id="checkbox2"/> <label for="checkbox">no-check</label></div>
</textarea>

Codepen

我制作了 an example，您可以在 codepen 查看它。

Answer 1

根据 this question 找到的答案，我设法找到了解决方案。

我给 TinyMCE 添加了一个设置函数。我还添加了对单选按钮和选择的支持。

tinymce.init({
    selector: 'textarea',
    height: 500,
    theme: 'modern',
    setup : function(ed) {
        // This function works for checkboxes
        ed.on('init', function(e) {
            $(ed.getBody()).on("change", ":checkbox", function(el){
                if(el.target.checked){
                    $(el.target).attr('checked','checked');
                }else{
                    $(el.target).removeAttr('checked');
                }
            });
            // Radiobuttons
            $(ed.getBody()).on("change", "input:radio", function(el){
                var name =  'input:radio[name="'+el.target.name+'"]';
                $(ed.getBody()).find(name).removeAttr('checked');
                $(el.target).attr('checked','checked');
                $(el.target).prop('checked',true);
            });
            // Selects
            $(ed.getBody()).on("change", "select", function(el){
                $(el.target).children('option').each(function( index ) {
                    if(this.selected){
                        $( this ).attr('selected','selected');
                    }else{
                        $( this ).removeAttr('selected');
                    }
                });
            });
        });
    }
});

如何在 tinyMCE 的源代码中获取复选框的选中状态？

How do I get the checked state of a checkbox in the sourcecode in tinyMCE?

tinymce

tinymce-4

代码

Codepen