Question

我尝试以这种方式捕获CKEditor保存按钮上发生的click事件

  var element = CKEDITOR.document.getById('CKEditor1');
  element.on('click', function (ev) {
      //ev.removeListener();
      alert('hello');
      return false;
  });

但它无效。当我点击CKEditor的保存按钮时，就会发生回发。如果可能的话，帮助我使用正确的代码示例捕获点击事件发生在CKEditor的保存按钮上。感谢

我得到了解决方案

  CKEDITOR.plugins.registered['save'] = {
      init: function (editor) {
         var command = editor.addCommand('save',
         {
              modes: { wysiwyg: 1, source: 1 },
              exec: function (editor) { // Add here custom function for the save button
              alert('You clicked the save button in CKEditor toolbar!');
              }
         });
         editor.ui.addButton('Save', { label: 'Save', command: 'save' });
      }
  }

上面的代码我正在寻找。上面的代码帮助我捕获工具栏中的保存按钮的单击事件。感谢

Answer 1

这是（在我看来）更好/更清洁的方式来完成你已经想到的。这只会替换保存按钮运行的javascript，这意味着它不会将保存按钮移出其原始工具栏组：

HTML：

<textarea id="CKEditor1"></textarea>

的javascript：

<script>
    // Need to wait for the ckeditor instance to finish initialization
    // because CKEDITOR.instances.editor.commands is an empty object
    // if you try to use it immediately after CKEDITOR.replace('editor');
    CKEDITOR.on('instanceReady', function (ev) {

        // Create a new command with the desired exec function
        var overridecmd = new CKEDITOR.command(editor, {
            exec: function(editor){
                // Replace this with your desired save button code
                alert(editor.document.getBody().getHtml());
            }
        });

        // Replace the old save's exec function with the new one
        ev.editor.commands.save.exec = overridecmd.exec;
    });

    CKEDITOR.replace('CKEditor1');

</script>

Answer 2

带有preventDefault()的

如果调用此方法，则不会触发事件的默认操作请试用此代码：

$(document).on('click', '#CKEditor1', function(ev){
   ev.preventDefault();
   alert('hello');
   return false;
});

This可能会对您有所帮助。

Answer 3

event.preventDefault()文档

Description: If this method is called, the default action of the event will not be triggered.

添加此...

 ev.preventDefault();

代码

  $('#CKEditor1').on('click', function (ev) {
      ev.preventDefault();
      alert('hello');
      return false;
  });

Answer 4

在提交按钮上使用mousedown而不是click，并添加ev.preventDefault以停止提交。

var element = CKEDITOR.document.getById('CKEditor1');
element.on('mousedown', function (ev) {
   ev.preventDefault();
   alert('hello');
   return false;
});

Answer 5

转到ckeditorcontrol属性并找到prerender事件，以便您可以使用prerender事件将文本保存在数据库中。

protected void CKEditorControl2_PreRender(object sender, EventArgs e)
{
  if (!string.IsNullOrWhiteSpace(CKEditorControl2.Text))
  {
    // write here what you want to save in your database.
  }
}

如何在CKEditor的Save按钮上捕获click事件

我得到了解决方案

5 个答案: