Javascript CKEditor：具有预定义值的占位符

这是将占位符工具加载到CKEditor中的常规脚本：

var ck\u edit\u new=CKEDITOR.replace（'email\u message\u new'{
外部插件：“占位符”，
身高：220
});

以下由扎卡里·奥尔森（Zachary Olson）撰写的博文解释了如何做到这一点：

基本上，您可以编辑文件

placcholder/dialog/placeholder.js

，将类型从text更改为select，然后添加所需的项目，如以下代码所示：

type : 'select',
items : [ [ 'meetingTime' ], [ 'meetingLocation' ] ],
'default' : 'meetingTime',

---

这是它的要点，但是你可以从Stephane answers开始了解更多细节，我找到了一个稍微不同的解决方案。 我采用的基本思想是等待编辑器对象存在，然后重新注册对话框。这样做的话，当插件代码被更新时，我不会冒被覆盖的风险

我使用angular.js实现了这个想法。在我的项目中，我借用了一个同事模块，其中ckeditor以这种方式包含在modulename-index.html中：

<div ckeditor="editorOptions" ng-model="obj.editorModel" ready="onReady()" />

---

因此，当我进行黑客攻击（如“hack'n'slash”，而不是“聪明的黑客攻击”）时，我通过在plugin placeholder.js中包含的CHECKEDITOR.dialog.add（）调用中转储定义了onReady（）函数，然后更改了元素类型并添加了项目数组。

知道这个线程有点旧，但是我也有同样的需求，我创建了一个插件来做你想要的事情。它不使用Angular，但它足够灵活，可以通过Angular进行配置

我已经为CKEditor创建了“Placeholder Tokens From Dropdown”插件。它的工作方式与Simon所说的strinsert插件大致相同，但更具灵活性

您可以传入包含“格式”的配置（如果您不想使用pleceholder插件格式）。默认情况下，它使用占位符格式[[something]]，但可以使用任何其他格式（例如{{something}}）

占位符标记可以通过配置作为JavaScript数组传入。该插件将为您完成其余的工作

---

使用CKEditor 4，您可以扩展

占位符

插件，而无需核心更改或自定义插件。下面的代码将占位符输入更改为与屏幕截图类似的选择：

CKEDITOR.on('dialogDefinition', function(event) {
  if ('placeholder' == event.data.name) {
    var input = event.data.definition.getContents('info').get('name');
    input.type = 'select';
    input.items = [ ['Company'], ['Email'], ['First Name'], ['Last Name'] ];
    input.setup = function() {
      this.setValue('Company');
    };
  }
});

---

来源：

您已经尝试了什么？您仅有的代码是初始化编辑器的代码。我建议您阅读官方指南，如和之后，根据您的需要更改占位符插件时应该不会有任何问题。是的，提供的代码初始化了一个包括占位符插件的实例。我只是想知道，如果在CKEditor文档中提到它（“…带有预定义选项的下拉列表…”请参见），那么是因为这是一件常见的事情，还是因为他们忘记添加一些示例片段？我想我得看一下开发文档。谢谢你找到答案了吗？我遇到了同样的问题，他们指出这是可能的，但没有关于如何做到这一点的文档…只是添加了我在下面找到的解决方案。您知道如何在onClick事件上提交input.type='radio'值吗？如果我尝试在通过单击“确定”按钮激活的“提交”事件上提交值，您的示例效果很好，但如果使用onClick事件，则不起作用。这应该作为一个新问题提问，但我可以帮助您。您可以监视收音机上的点击，并模拟单击“确定”按钮。如果您使用的是jQuery，请在input.setup函数中添加以下内容：

$（'.cke\u dialog\u ui\u radio\u input'）。在（'click'，function（）{$（'.cke\u dialog\u ui\u button\u ok'）[0]。click（）；}）