onkeyup 在针对 tinymce 的 jQuery Validate 中不起作用

Posted 2023-05-09

【中文标题】onkeyup 在针对 tinymce 的 jQuery Validate 中不起作用

【英文标题】：onkeyup is not working in jQuery Validate for tinymce

【发布时间】：2020-09-17 10:53:39

【问题描述】：

为了验证表单，我使用插件 JQuery Validation (jquery.validate.js) 和附加方法。此表单包含许多输入，其中检查了要填写的字段。我对文件使用 onkeyup 规则。一切正常，但不适用于tinymce 的onkeyup 规则。需要注册什么才能使用？

jQuery(function ($) 
        var validator = $("#adminForm").submit(function() 
            // update underlying textarea before submit validation
            tinyMCE.triggerSave();
        ).validate(
    onkeyup: function(element) 
        this.element(element);  // <- "eager validation"
    ,
    onfocusout: function(element) 
        this.element(element);  // <- "eager validation"
    ,
            ignore: "",
            rules: 
                title: 
                    required: true,
                    minlength: 10,
                    maxlength: 50
                ,
                donate: 
                    required: true,
                    digits: true,
                    min: 1,
                    max: 60000
                ,
                text: 
                    required: true,
                    minlength: 250
                ,
                checkbox: 
                    required: true
                
            ,
            messages: 
                title: 
                    required: "enter the title",
                    minlength: "no less than 10 symbols",
                    maxlength: "no more than 50 symbols"
                ,
                donate: 
                    required: "enter the number",
                    digits: "Not a number",
                    min: "no less than 1",
                    max: "no more than 60000"
                ,
                text: 
                    required: "here is your text",
                    minlength: "no less than 250 symbols"
                ,
                checkbox: 
                    required: "do you public spam?"
                
            ,
            errorPlacement: function(label, element) 
                // position error label after generated textarea
                if (element.is("textarea")) 
                    label.insertAfter(element.next());
                 else 
                    label.insertAfter(element)
                
            
        );
        validator.focusInvalid = function() 
            // put focus on tinymce on submit validation
            if (this.settings.focusInvalid) 
                try 
                    var toFocus = $(this.findLastActive() || this.errorList.length && this.errorList[0].element || []);
                    if (toFocus.is("textarea")) 
                        tinyMCE.get(toFocus.attr("id")).focus();
                     else 
                        toFocus.filter(":visible").focus();
                    
                 catch (e) 
                    // ignore IE throwing errors when focusing hidden elements
                
            
        
    );

【参考方案1】：

当您加载 TinyMCE 时，编辑器区域实际上是一个 iframe，而不是主页的一部分，因此像 keyup 这样的事件不会发生在主页中，而是在 iframe 中。您当然也可以将事件处理添加到 iframe，但这就是为什么您没有看到基于在编辑器中输入而触发的这些事件。

【讨论】：

那么，您会推荐什么解决方案？究竟需要做什么？