我正在使用jQuery TE插件(http://jqueryte.com/)。它似乎不能与jQuery验证插件一起工作。
一个普通的文本区工作得很好,但如果我想把它转换成一个所见即所得的jqe,我失去了这个功能。
在这个例子中,Name和Bio字段被验证,但是Resume字段没有被验证。
jsFiddle
Html:<form id="frmExample">
<div><b>Name:</b></div>
<input name="txtName" id="txtName" class="required" />
<br />
<div><b>Bio:</b></div>
<textarea cols="40" rows="6" name="txtBio" id="txtBio" class="required"></textarea>
<br />
<div><b>Resume</b></div>
<textarea name="txtResume" class="required" id="txtResume"></textarea>
<br />
<br />
<input type="submit" value="Save" />
JS:
$("#txtResume").jqte();
$("#frmExample").validate();
我在博客中有一个详细的例子:http://chadkuehn.com/jquery-te-validation/
当你在TEXTAREA标签上放置一个字体时,它会隐藏原来的元素。因此,在验证插件中,您必须调整突出显示和取消突出显示时可见的标记。您还必须对错误标签的位置做一些调整。
errorPlacement: function (error, element) {
var el = $(element).closest(".jqte");
if (el.length == 1) {
error.insertAfter(el);
} else {
error.insertAfter(element);
}
},
highlight: function (element, errorClass, validClass) {
$(element).addClass(errorClass).removeClass(validClass);
var el = $(element).closest(".jqte");
if (el.length == 1) {
el.addClass(errorClass);
}
},
unhighlight: function (element, errorClass, validClass) {
$(element).removeClass(errorClass).addClass(validClass);
var el = $(element).closest(".jqte");
if (el.length == 1) {
el.removeClass(errorClass);
}
}
. NET MVC我推荐这个…要使用jqte自动验证jQuery,请在启动时执行:
$('.jqte_editor').change(function () {
if ($(this).parent().siblings('.textarea-editor').hasClass('.input-validation-error'))
$(this).parent().addClass('input-validation-error');
else
$(this).parent().removeClass('input-validation-error');
});
$('form').bind('submit', function () {
$('.textarea-editor.input-validation-error').parent().parent().addClass('input-validation-error');
$('.textarea-editor:not(.input-validation-error)').parent().parent().removeClass('input-validation-error');
});
记住在textarea