我有一个要验证的字段，knockout 处理这个元素的验证。 接下来我有一个 input-group-addon，当 knockout 验证开始时，它越界了。我一直在尝试寻找修复，但我找不到另一个解决这个问题的方法。
问题:
老实说，代码本身非常简单:
<div class="form-group" data-bind="validationElement: emailRepeated">
<label for="emailRepeated" data-bind="text: translate('EmailConfirm')">[Confirm your Email Address]</label>
<div class="input-group">
<span class="input-group-addon">@</span>
<input type="email" class="form-control" id="emailRepeated" data-bind="value: emailRepeated" >
</div>
</div>我的 knockout 只有这样的扩展器:
self.emailRepeated.extend({ required: true, email: true, equal: self.email });
有人知道如何让输入插件与输入保持在一起吗？
编辑: 验证后的结果 HTML:
<div class="input-group">
<span class="input-group-addon">@</span>
<input type="email" class="form-control has-error" id="emailRepeated" data-bind="value: emailRepeated" title="This is not a proper email address" data-orig-title="">
<span class="help-block" style="">This is not a proper email address</span>
</div>请您参考如下方法:
您可以使用errorClass configuration option设置您自己的 css 类。然后是适当的 float 问题，我想可以达到您想要的效果。
好的，我想我找到了解决方案。尝试添加以下 CSS
.input-group .validationMessage {
display: table-caption;
caption-side: bottom;
}这会将其格式化为表格样式的新行(标题)并将其放置在底部
Here is a fiddle用于演示目的
更新:second version fiddle
