元素和jQueryvalidation插件的问题

我准备了一个演示 [contenteditable]元素没有HTML表单的DEMO 。 至于我,这是一个问题,因为jQueryvalidation插件需要forms。 从383行开始查看此处的源代码片段:

 function delegate( event ) { var validator = $.data( this.form, "validator" ), eventType = "on" + event.type.replace( /^validate/, "" ), settings = validator.settings; if ( settings[ eventType ] && !$( this ).is( settings.ignore ) ) { settings[ eventType ].call( validator, this, event ); } } $( this.currentForm ) .on( "focusin.validate focusout.validate keyup.validate", ":text, [type='password'], [type='file'], select, textarea, [type='number'], [type='search'], " + "[type='tel'], [type='url'], [type='email'], [type='datetime'], [type='date'], [type='month'], " + "[type='week'], [type='time'], [type='datetime-local'], [type='range'], [type='color'], " + "[type='radio'], [type='checkbox'], [contenteditable]", delegate ) // Support: Chrome, oldIE // "select" is provided as event.target when clicking a option .on( "click.validate", "select, option, [type='radio'], [type='checkbox']", delegate ); 

在这里我们可以看到,元素,其中一个是[contenteditable]监听事件然后调用delegate事件处理程序。

[contenteditable]从此列表中触发某个事件时, delegate方法尝试从元素var validator = $.data( this.form, "validator" )获取validationvar validator = $.data( this.form, "validator" )但正如我之前所说[contenteditable]没有forms(请参阅DEMO )。

有什么方法可以解决这个问题吗? 也许可以为所有[contenteditable]元素添加表单?

这是jquery validator plugin的已知错误。 但是,现在已在此拉取请求中修复此问题,应尽快发布。

修复1:

如果您不能等待发布,那么修复是将此代码放在delegate()方法的开头。 解决方案由@svrx

 // Set form expando on contenteditable if ( !this.form && this.hasAttribute( "contenteditable" ) ) { this.form = $( this ).closest( "form" )[ 0 ]; } 

正如您所看到的,修复只是将表单设置为父元素。

修复2:

正如@chrisAtomix在他的评论中所说,不要使用最新的jquery validator plugin 。 而是使用尚未添加contenteditablefunction的较低版本。 他正在使用v1.14.0

是否正在探索validation的忽略选项来解决您的问题?

 ignore: ":hidden:not('#summernote')" 

更新小提琴 – https://jsfiddle.net/z6eLvk0b/2/