如何在 CKEditor textareas 上觸發模糊事件？

Question

我們有一些代碼用於驗證在模糊上運行的 CKEditor textarea 上的輸入。 我們向所有使用 CKEditor 的 textareas 添加一個類ckeditor_textarea並運行此代碼以將必要的函數附加到模糊事件：

$("textarea.ckeditor_textarea").each(function(){
    var textarea_id = $(this).attr("id");
    CKEDITOR.instances[textarea_id].on('blur',function(){
        // Validation functions here
    });
});

這可以在模糊事件發生時觸發驗證功能。 但是我們還需要在提交按鈕按下時手動觸發模糊事件，以在提交之前在這些 CKEditor 文本區域上運行驗證功能。

你如何在 CKEditor 文本區域上觸發模糊事件？ 使用 jQuery 語法（這當然不起作用，因為 CKEditor 實例不是 jQuery 對象），我基本上是在尋找這樣的東西：

$("textarea.ckeditor_textarea").each(function(){
    var textarea_id = $(this).attr("id");
    CKEDITOR.instances[textarea_id].trigger('blur');
});

Answer 1

1. 你不應該混合 jQuery 事件和 CKEDITOR 事件。 如果您想為 CKEDITOR 實例設置模糊，請注冊它：

   ckeInst.on('模糊', 函數(e){

   });

然后，如果你真的想觸發模糊事件，你可以這樣做：

ckeInst.focusManager.blur( true ); 

編輯器是從事件（如果有）或通過 CKEDITOR.instances['yourCkeName']; 檢索的；

Answer 2

對於提交驗證，我建議在提交處理程序中使用updateElement()方法，然后運行驗證代碼：

以下將使用頁面上的編輯器更新任何和所有元素：

$('form').on('submit', function(e){
     for (instance in CKEDITOR.instances) {
         CKEDITOR.instances[instance].updateElement();
      }
      // run validation code

});

這也確保表單數據與編輯器本身保持同步

Answer 3

根據@charlietfl 的回答，我能夠針對我的情況提出解決方案。

首先，我創建了一個運行驗證代碼的調用函數：

function ckeditor_blur_event(textarea_id){
    // validation code  
}

然后，我更改了問題中的第一個代碼塊以使用新函數：

$("textarea.ckeditor_textarea").each(function(){
    var textarea_id = $(this).attr("id");
    ckeditor_blur_event(textarea_id)
});

最后，我在提交表單時觸發相同的驗證代碼：

$("textarea.ckeditor_textarea").each(function(){
    var textarea_id = $(this).attr("id");
    CKEDITOR.instances[textarea_id].updateElement();
    ckeditor_blur_event(textarea_id)
});

Answer 4

對我來說可靠和正確工作的唯一方法是：

editor.window.$.frameElement.blur();