最近项目的前端使用了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上还得多下些功夫,水平实在是不怎么样啊。
分享到:
相关推荐
2 remote:"check.php" 使用 ajax 方法调用 check.php 验证输入值。 3 email:true 必须输入正确格式的电子邮件。 4 url:true 必须输入正确格式的网址。 5 date:true 必须输入正确格式的日期。日期校验 ie6 出错,慎...
CKEditor无法验证的解决方案(js验证+jQuery Validate验证)_.docx
非常好的Jquery validate:每个案例独立,都有注释 讲解了: 环境搭建 常见验证方法配置 国际化错误消息 自定义方法和远程验证 给验证添加 图标效果
jQuery validate 验证 个性化验证
jQuery验证框架jquery.validate.js说明文档 手册
jquery validate 验证手册
主要为大家详细介绍了CKEditor无法验证的解决方案和jQuery Validate验证框架,感兴趣的小伙伴们可以参考一下
自做的一个简单的表单验证 jquery validate 表单验证 jquery validate 表单验证
包含以下文件: additional-methods.js additional-methods.min.js jquery.validate.js jQuery.validate.js+API中文.pdf jquery.validate.min.js
jQuery Validate 插件为表单提供了强大的验证功能,让客户端表单验证变得更简单,同时提供了大量的定制选项,满足应用程序各种需求。该插件捆绑了一套有用的验证方法,包括 URL 和电子邮件验证,同时提供了一个用来...
很好用的页面验证框架,对页面表单数据验证及提示很方便!
jQuery.validate.js+API中文 jquery-validation-1.8.1.zip
jquery表单验证框架:jquery.validate.zip 附:中文API 文档
jquery-validate验证框架使用详解及JS文件
jquery-validate 可对前端form进行表单校验,文档里详细介绍了如何使用jquery-validate框架和如何扩展验证方法。
JQuery的validate验证框架.完整的验证项目,在eclipse+tomcat7.0环境下运行!!
JQuery核心文件,JQuery的validate校验文件,validate校验messages_zh中文文件
jquery validate表单验证插件制作注册表单提交验证 jquery validate表单验证插件制作注册表单提交验证
jquery-validate前台验证框架,带详细使用方法。共同进步共同研究学习
jquery validate验证示例各种验证 齐全包含jquery需要用的js文件