xheditor与validate插件冲突的解决方案


Posted in Javascript onApril 15, 2010

xheditorvalidate都是优秀的jQuery插件,但将两者组合到起,如果初始化的顺序不当,则会出现一些微妙的结果。我在做一个文本提交页面时就同时用到了这两个插件,一个用于显示富文本编辑器,一个用来验证用户是否填写的内容,我的初始化代码如下:

$("#form1").validate({ 
rules: { 
Body: "required" 
}, 
messages: { 
Body: "请填写正文" 
} 
}); 
var editor = $("#Body").xheditor(true, { 
tools: "simple" 
});

但在提交时,尽管已经填写了内容,第一次点击提交按钮时仍然显示“请填写正文”,第二次点击提交按钮时才会真正提交,这一现象让我百思不得其解,究竟问题出在哪了呢?

因为当前项目中有多个页面都用到了这两个插件,而其中有一个页面提交时是正常的,于是我便仔细的对比了正常的和有问题的页面异同,发现初始化的顺序不一样。在能正常提交的页面中先初始化的xheditor,然后初始化的validate,而有问题的页面正好相反,原来是这样!问题到此也用迎刃而解了,只要颠倒这两个插件的初始化顺序,让xheditor在validate之前初始化,就可避免“两次提交”问题的发生。

希望本文对您有所帮助。

CKEditor也有这问题,我解决方法是获取Editor里内容放入到textarea里就好了。

Javascript 相关文章推荐
用于判断用户注册时,密码强度的JS代码
Jan 01 Javascript
jQuery判断元素是否是隐藏的代码
Apr 24 Javascript
Javascript类定义语法,私有成员、受保护成员、静态成员等介绍
Dec 08 Javascript
javascript实现点击后变换按钮显示文字的方法
May 13 Javascript
EXT中单击button按钮grid添加一行(光标位置可设置)的实例代码
Jun 02 Javascript
bootstrap中添加额外的图标实例代码
Feb 15 Javascript
JavaScript原生数组Array常用方法
Apr 06 Javascript
微信小程序中多个页面传参通信的学习与实践
May 05 Javascript
node中的cookie的具体使用
Sep 13 Javascript
VUE 解决mode为history页面为空白的问题
Nov 01 Javascript
vuex state中的数组变化监听实例
Nov 06 Javascript
nuxt 自定义 auth 中间件实现令牌的持久化操作
Nov 05 Javascript
js 获取Listbox选择的值的代码
Apr 15 #Javascript
JavaScript toFixed() 方法
Apr 15 #Javascript
js function定义函数使用心得
Apr 15 #Javascript
combox改进版 页面原型参考dojo的,比网上jQuery的那些combox功能强,代码更小
Apr 15 #Javascript
关于文本框的一些限制控制总结~~
Apr 15 #Javascript
JS input文本框禁用右键和复制粘贴功能的代码
Apr 15 #Javascript
JQuery,Extjs,YUI,Prototype,Dojo 等JS框架的区别和应用场景简述
Apr 15 #Javascript
You might like
解析php防止form重复提交的方法
2013/07/01 PHP
JavaScript 注册事件代码
2011/01/27 Javascript
js获取网页高度(详细整理)
2012/12/28 Javascript
js 有框架页面跳转(target)三种情况下的应用
2013/04/09 Javascript
js循环改变div颜色具体方法
2013/06/25 Javascript
jquery实现动态画圆
2014/12/04 Javascript
深入理解JavaScript系列(39):设计模式之适配器模式详解
2015/03/04 Javascript
jQuery可见性过滤器:hidden和:visibility用法实例
2015/06/24 Javascript
jquery实现简洁文件上传表单样式
2015/11/02 Javascript
关于json字符串与实体之间的严格验证代码
2016/11/10 Javascript
javascript字体颜色控件的开发 JS实现字体控制
2017/11/27 Javascript
vue中echarts3.0自适应的方法
2018/02/26 Javascript
JS实现的冒泡排序,快速排序,插入排序算法示例
2019/03/02 Javascript
vue项目打包上传github并制作预览链接(pages)
2019/04/19 Javascript
vue-cli webpack配置文件分析
2019/05/20 Javascript
详解Angular cli配置过程记录
2019/11/07 Javascript
[43:32]2014 DOTA2华西杯精英邀请赛 5 25 LGD VS NewBee第一场
2014/05/26 DOTA
python网络爬虫采集联想词示例
2014/02/11 Python
python输出指定月份日历的方法
2015/04/23 Python
python 分离文件名和路径以及分离文件名和后缀的方法
2018/10/21 Python
Python使用folium excel绘制point
2019/01/03 Python
利用python提取wav文件的mfcc方法
2019/01/09 Python
OpenCV3.0+Python3.6实现特定颜色的物体追踪
2019/07/23 Python
关于pandas的离散化,面元划分详解
2019/11/22 Python
TensorFlow实现指数衰减学习率的方法
2020/02/05 Python
Jacadi Paris美国官方网站:法国童装品牌
2017/10/15 全球购物
国际旅客访问北美最大的汽车租赁提供商:Alamo Rent A Car
2018/06/13 全球购物
英国手工制作的现代与经典的沙发和床:Love Your Home
2020/09/26 全球购物
工程采购员岗位职责
2014/03/09 职场文书
公安交警中队队长个人对照检查材料思想汇报
2014/10/05 职场文书
财产分割协议书范本
2014/11/03 职场文书
自查自纠整改报告
2014/11/06 职场文书
夫妻双方自愿离婚协议书怎么写
2014/12/01 职场文书
2014年高校辅导员工作总结
2014/12/09 职场文书
2016年第二十届“母亲节暨幸福工程救助贫困母亲活动日”活动总结
2016/04/06 职场文书
解析在浏览器地址栏输入一个URL后发生了什么
2021/06/21 Servers