I would like to have effect similar to the one below. Of course best KISS, without tons of JS, etc.
我希望有类似于下面的效果。当然最好的KISS，没有大量的JS等。
Possible? Would be glad to see some working demo. Best for Twitter Bootstrap 2.3.
可能？很高兴看到一些工作演示。最适合Twitter Bootstrap 2.3。
For now I have tried with append:
现在我尝试追加：
$ ->
$('#ajax_search_input').append('#danger")
http://jsfiddle.net/andilab/sLmyJ/ I forked also this: http://jsfiddle.net/andilab/kvH9E/ regarding adding of icon. Can it be generalized to badge?
http://jsfiddle.net/andilab/sLmyJ/我也分了这个：http：//jsfiddle.net/andilab/kvH9E/关于添加图标。它可以概括为徽章吗？
1 个解决方案
#1
4
You do not need javascript to accomplish this - you can use absolute positioning to make it appear as if the label is inside of the input. Simple demo below:
您不需要使用javascript来完成此操作 - 您可以使用绝对定位使其看起来好像标签位于输入内部。简单演示如下：
http://jsfiddle.net/sLmyJ/1/
.label-danger {
position: absolute;
left: 3px;
top: 5px;
}
Edit - to expand on this, you cannot have any additional elements inside of an input. This is one reason why the button element is often used instead of input[type="button"].
编辑 - 要对此进行扩展，您不能在输入中包含任何其他元素。这是为什么经常使用按钮元素而不是输入[type =“button”]的一个原因。
#1
4
You do not need javascript to accomplish this - you can use absolute positioning to make it appear as if the label is inside of the input. Simple demo below:
您不需要使用javascript来完成此操作 - 您可以使用绝对定位使其看起来好像标签位于输入内部。简单演示如下：
http://jsfiddle.net/sLmyJ/1/
.label-danger {
position: absolute;
left: 3px;
top: 5px;
}
Edit - to expand on this, you cannot have any additional elements inside of an input. This is one reason why the button element is often used instead of input[type="button"].
编辑 - 要对此进行扩展，您不能在输入中包含任何其他元素。这是为什么经常使用按钮元素而不是输入[type =“button”]的一个原因。