引导帮助块仅在表单组有错误时显示

本文介绍了引导帮助块仅在表单组有错误时显示的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！ 问题描述

我有一个注释表单，该表单还将引导帮助块显示为:

I have a comment form that is showing also the bootstrap help-block as:

<p class="help-block">required</p>

我希望隐藏此p，除非提交表单并验证该字段为错误时.

I want this p to be hidden except when the form is submitted and the field is validated as an error.

提交表单时出错，父级<div class="form-group">...</div>将获得一个附加的has-error类.仅当表单提交中有错误时，我才能显示help-block吗?顺便说一句，我无权访问HTML ...

when the form is submitted with an error, the parent <div class="form-group">...</div> gets an additional has-error class. How could I show the help-block only if there is an error in the form submission? Btw I have no access to the HTML...

推荐答案

CSS方式

.help-block { display: none; } .form-group.has-error .help-block { display: block; }

jQuery方式

$('.help-block').hide(); $('#yourForm').submit(function(){ $.each($(this).find('.form-group'), function(){ // Long but clear version if ( $(this).hasClass('has-error') ) { $(this).find('.help-block').show(); } else { $(this).find('.help-block').hide(); } // Shortest version // $(this).find('.help-block')[ $(this).hasClass('has-error') ? 'show' : 'hide' ](); }); });