Tinymce.get和tinymce.activeEditor都返回null

Question

I have a tinymce textarea in HTML: <textarea id="customer_notes"></textarea> 我有一个HTML中的tinymce textarea： <textarea id="customer_notes"></textarea>

And in JS I try to access this textarea with 在JS中我尝试访问这个textarea

tinymce.get('customer_notes').on("keyup", function(){ console.log("tiny"); })

OR 要么

tinymce.activeEditor.on('keyup', function(){ console.log("keyup"); })

However, both are returning null. 但是，两者都返回null。 I understand that there can be an issue with the element not being loaded on the page yet, and therefore is inaccessible. 我知道可能存在未在页面上加载元素的问题，因此无法访问。

BUT just above either statement I try, if I output console.log(tinymce.editors); 但是，如果我输出console.log(tinymce.editors);我会尝试上面的任何一个语句console.log(tinymce.editors); it outputs an array containing my textarea, with the id "customer_notes". 它输出一个包含我的textarea的数组，其id为“customer_notes”。

0: {…}, id: "customer_notes", isNotDirty: true, plugins: {…}, …}ustomer_notes: eN { id: "customer_notes", isNotDirty: true, plugins: {…}, …} length: 1 __proto__: Array(0)

I have read several other posts with this issue, but none of the solutions seem to work for me. 我已经阅读了这个问题的其他几篇文章，但没有一个解决方案似乎适合我。 One answer suggested using tinymce.editors[0] but that is undefined? 一个答案建议使用tinymce.editors[0]但这是未定义的？

Thanks in advance! 提前致谢！

Answer 1

Your code seems to work fine. 你的代码似乎工作正常。 If you can share all your HTML and JS then maybe we can pinpoint where the issue is. 如果您可以共享所有HTML和JS，那么我们可以确定问题所在。 In the meantime, here's a working example to hopefully help you along: JSFiddle . 与此同时，这是一个有希望帮助你的工作示例： JSFiddle 。

HTML: HTML：

<!DOCTYPE html>
<html>
<head>
  <script src="https://cloud.tinymce.com/5/tinymce.min.js"></script>
</head>
<body>
  <textarea id="customer_notes"></textarea>
</body>
</html>

JS: JS：

$(function(){
  tinymce.init({ selector:'textarea' });

  tinymce.get('customer_notes').on("keyup", function(){
    console.log("tiny");
  });

  tinymce.activeEditor.on('keyup', function(){
    console.log("keyup");
  });
});

Answer 2

If you want to capture events regarding an instance of TinyMCE you can actually setup these event functions directly in your init({}) function. 如果要捕获有关TinyMCE实例的事件，您可以直接在init({})函数中设置这些事件函数。

Here is an example: 这是一个例子：

http://fiddle.tinymce.com/7Hgaab http://fiddle.tinymce.com/7Hgaab

You will see there is a setup function in the init and that setup function automatically gets access to your editor object so you can setup your keyup event function in that setup function. 您将看到init中有一个setup功能，该设置功能会自动访问您的editor对象，因此您可以在该setup功能中设置您的keyup事件功能。

The code to look at in the init({}) is: 要在init({})查看的代码是：

setup: function (editor) {
  editor.on('keyup', function (e) {
    console.log('A key was pressed: ', e.keyCode); 
  });
}

Tinymce.get和tinymce.activeEditor都返回null

问题描述

2 个解决方案

解决方案1
0 2019-05-10 04:37:26

解决方案2
0 2019-05-10 15:09:21

Tinymce.get和tinymce.activeEditor都返回null

问题描述

2 个解决方案

解决方案1 0 2019-05-10 04:37:26

解决方案2 0 2019-05-10 15:09:21

解决方案1
0 2019-05-10 04:37:26

解决方案2
0 2019-05-10 15:09:21