在我们的AngularJS应用程序中,我们动态设置必填字段(ng-required)。因此,每次需要添加一个
现在我们有另一个想法。可能可以将输入字段本身标记为必填项。在this post中,我们找到了部分解决方案。
有一些CSS选择器用于必填字段,因此我们可以像这样设置背景图片:
但是这种方法需要一个
然后我们发现了this (标记为)的示例,似乎可以将文本添加到输入字段中。
所以问题是,如何将所有内容组合在一起,以便在需要时将Twitter-Bootstrap的glyphicon放置在输入字段的右侧,而无需编辑所有表单?
这里有一个jsFiddle。那可能有效,但问题是,background-size并不是在所有地方都支持。
*
到标签中变得相当复杂。现在我们有另一个想法。可能可以将输入字段本身标记为必填项。在this post中,我们找到了部分解决方案。
有一些CSS选择器用于必填字段,因此我们可以像这样设置背景图片:
input:required:valid {
background-image: url(valid.png);
background-position: right center;
background-repeat: no-repeat;
}
input:required:invalid {
background-image: url(invalid.png);
background-position: right center;
background-repeat: no-repeat;
-moz-box-shadow: none;
}
<p>Name:</p>
<input type="text" name="name" required />
但是这种方法需要一个
*
的背景图像,这似乎非常繁琐。特别是,如果表单有不同的大小,则图像具有不同的分辨率。然后我们发现了this (标记为)的示例,似乎可以将文本添加到输入字段中。
所以问题是,如何将所有内容组合在一起,以便在需要时将Twitter-Bootstrap的glyphicon放置在输入字段的右侧,而无需编辑所有表单?
这里有一个jsFiddle。那可能有效,但问题是,background-size并不是在所有地方都支持。