$('#defaultForm').submit(function () { $('#defaultForm').data('bootstrapValidator') .updateStatus('inputName', 'NOT_VALIDATED', null) .validateField('inputName');$($('#UEId div')[0]).css('border-color', $('#labelId').css('color')); })
终于可以看到最终的效果了，而且我们提交表单的时候可以直接拿文本框的val()了，不想要多加一个判断if(是UEditor){....}了.最终附上整个html的内容
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title></title> <link href="https://www.jb51.net/Scripts/bootstrap.css" /> <link href="https://www.jb51.net/bootstrapValidator.min.css" /> <style> .form-control-feedback { margin-right: 10px; } </style> </head> <body> <form> <div> <label> UEditor测试 </label> <div> <script type="text/plain"></script> <input type="text" /> </div> </div> <div> <button type="submit">保存</button> </div> </form> </body> </html> <script src="https://www.jb51.net/jquery-1.9.1.min.js"></script> <script src="https://www.jb51.net/Scripts/bootstrap.min.js"></script> <script src="https://www.jb51.net/bootstrapValidator.min.js"></script> <script src="https://www.jb51.net/UEeditor/ueditor.config.js"></script> <script src="https://www.jb51.net/UEeditor/ueditor.all.min.js"></script> <script src="https://www.jb51.net/zh_CN.js"></script> <script src="https://www.jb51.net/UEeditor/lang/zh-cn/zh-cn.js"></script> <script type="text/javascript"> $(function () { editor = UE.getEditor("UEId", { initialFrameHeight: 40 }).ready(function () { var editor = UE.getEditor("UEId"); /*找到UEditor的iframe*/ var margintop = $($('#UEId .edui-editor-toolbarbox')[0]).height(); $($('#divId i')[0]).css('margin-top', margintop); var contents = $('#UEId').find('iframe').contents(); var fn = function () { $("#inputId").val(UE.getEditor("UEId").getContent()); $('#defaultForm').data('bootstrapValidator')//重新验证inputName .updateStatus('inputName', 'NOT_VALIDATED', null) .validateField('inputName'); $($('#UEId div')[0]).css('border-color', $('#labelId').css('color')); } if (document.all) {//document.all识别是否在IE下，在IE下为true contents.get(0).attachEvent('onpropertychange', function (e) { fn(); }); } else { contents.on('input', fn); } }); $('#defaultForm').submit(function () { $('#defaultForm').data('bootstrapValidator') .updateStatus('inputName', 'NOT_VALIDATED', null) .validateField('inputName'); $($('#UEId div')[0]).css('border-color', $('#labelId').css('color')); }) $('#defaultForm').bootstrapValidator({ message: '验证未通过', feedbackIcons: { valid: 'glyphicon glyphicon-ok', invalid: 'glyphicon glyphicon-remove', validating: 'glyphicon glyphicon-refresh' }, fields: { inputName: {//所提交的控件name属性 message: '所提交的数据不能为空', validators: { notEmpty: { //非空提示 message: '填写的数据不能为空' }, } }, } }).on('success.form.bv', function (e) { e.preventDefault(); var $form = $(e.target); var bv = $form.data('bootstrapValidator'); //这里提交表单 $.post('address', { data: "data" }, function (result) { alert(result); }); }); }) </script>
里面用到的一些bootstrap，jquery啥的自己记得加上去。