首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > Web前端 >

jQuery Validate验证框架 + CKEditor 无法验证有关问题的解决办法

2012-11-01 
jQuery Validate验证框架 + CKEditor 无法验证问题的解决方法最近项目的前端使用了jQuery,表单的前端验证

jQuery Validate验证框架 + CKEditor 无法验证问题的解决方法
最近项目的前端使用了jQuery,表单的前端验证用的是jQuery Validate,用起来很简单方便,一直都很满意的。

前段时间,根据需求为表单中的 textarea 类型的元素加上了html富文本编辑器,用的是CKEditor,功能强大,定制方便,也很满意。

不过用CKEditor增强过的 textarea 元素,这个字段要求是非空的,在jQuery Validate总是验证不通过,原因就是在 CKEditor 编辑器填写了内容之后,编辑器并不是立即把内容更新到原来的 textarea 元素中的,我没仔细看源代码,试过一种情况就是每一次提交不通过,第二次提交就可以通过的,貌似编辑器是在 submit 事件之前把编辑器的内容更新到 textarea 中的(这个是猜测,不知道对不对,我对jQuery 和 CKEditor 都不太熟悉,算是拿来就用,有问题就放狗的那种)。

于是在网上找到了解决问题的代码,代码不是我写的,我只是记录一下我遇到的问题,代码非原创。原理就是当编辑器更新了内容之后,立即把内容更新到 textarea 元素。

原文链接 http://stackoverflow.com/questions/1908592/jquery-validation-plugin-ckeditor-validate-when-typing

CKEDITOR.instances["page_content"].on("instanceReady", function()        {                        //set keyup event                        this.document.on("keyup", updateTextArea);                         //and paste event                        this.document.on("paste", updateTextArea);        });        function updateTextArea()        {                CKEDITOR.tools.setTimeout( function()                            {                                 $("#page_content").val(CKEDITOR.instances.page_content.getData());                                $("#page_content").trigger('keyup');                            }, 0);          }


目前一切使用正常,算是解决了一个让我头痛的问题,由此也可以看到,我在Javascript上还得多下些功夫,水平实在是不怎么样啊。

1 楼 supercwg 2010-07-26   使用jQuery Validate作验证的时候,没有遇到当显示错误信息时,本身排好版面的页面就变形了,除非要预留显示错误信息的足够空间。请问您是如何解决的呢? 2 楼 yangzhihuan 2010-07-27   错误信息的显示我是让它默认的,我的页面没有出现变形的情况,所以并未深究这一步是如何工作的。

估计要看源代码,然后修改Validate默认的行为了。

热点排行