Question

我有一个带有textarea的表单，我在其中实现了tinyMCE WYSIWYG编辑器。当我抓住提交按钮时，文本应该显示在控制台中（用于测试目的）。相反，它输出空白。我忘记了什么吗？

 <form>
    <textarea id="forumreply" style="width:100%;margin-top:1rem;height:10rem;"></textarea>
    <div id="replyerrbox" class="errboxtxt"></div>
    <button id="forumreplysubbut" class="btn btn--orange">Send</button>
</form>

<script> 


document.getElementById('forumreplysubbut').addEventListener('click',function(event){
    event.preventDefault();
    var err = new Array();
    var reply = document.getElementById('forumreply');
    var rpid = <?php echo $postId; ?>;
    var errbox = document.getElementById('replyerrbox');

    console.log(reply.value);
    /*
    if(reply.value.trim().length < 100){
        err.push(1);
    }
    if(err.length != 0){
        errbox.innerHTML = "Replies must be 100 characters in length.";
    }else{
        var dta = new FormData();
        dta.append('reply',reply.value);
        dta.append('rpid',rpid);
        var req = new XMLHttpRequest();
        req.onreadystatechange = function(){
            reply.value = null;
            getReplies();
        }
        req.open('POST','includes/processforumreply.php',true);
        req.send(dta);
    }*/


});
</script>

<script>
  tinymce.init({ selector:'textarea',
  branding:false, 
  menubar:false,
  mobile:{theme:'mobile'},
  plugins: 'emoticons',
  toolbar: 'undo redo | bold italic | link emoticons' });
</script>

Answer 1

TinyMCE模仿你的textarea，实际编辑在另一个元素中发生。所以，你需要明确地得到它的内容：

<script>
  tinymce.init({ selector:'textarea',
    //... your code
    init_instance_callback: function (editor) {
      document.getElementById('forumreplysubbut').addEventListener('click', function(){
        var resultingSource = editor.getContent()
        console.log(resultingSource)
      }
    }
  }
)
 </script>

查看编辑器docs，了解获取其实例的其他方法。

TinyMCE不在控制台中输出文本

1 个答案: