如何在输入标签中创建货币的静态符号

How to make a static sign of a currency in the input tag

本文关键字：货币 静态 符号 创建 输入 标签      更新时间：2023-09-26

我想当我使用tab键关注输入标签时，它不应该突出显示$符号，而是保持它的静态，让用户键入值，如果用户想让它留空，那么它应该显示它的占位符以及静态$符号。

这是我正在尝试的标记:

 <div style="width: 40%; float: right;">                    
    <input id="value" type="text" name="value" placeholder="$ Value" value="" required="required" onfocus="this.placeholder = '$ ', this.value='$ '" onblur="this.placeholder = '$ Value'" />
 </div>

如果你一直需要它，我会单独放置$ sign，并且使用相同的颜色:

<div style="width: 40%; float: right;">    
    <span style="border: 1px solid black; color:grey"> $
        <input id="value" type="text" style="border: none; outline: 0" name="value" placeholder="Value" value="" required="required"/>
    </span>
</div>

我也有一个变体，$符号在输入，但在这种情况下，它将改变颜色为黑色时，活动:

<div style="width: 40%; float: right;">
    <input id="value" type="text" name="value" placeholder="$ Value" value="" required="required" onfocus="if(this.value == '') this.value='$ '" onblur="if(this.value == '$ ') this.value = ''" />
</div>

这是jsfield:

http://jsfiddle.net/hv188mj7/
HTML: 

<input id="value" type="text" name="value" placeholder="$ Value" value="" onfocus="
this.placeholder = '$ '+this.value; 
var s = this.value;
var r = s.slice(2,99999);
 this.value = r;
this.value='$ '+this.value
" onblur="this.placeholder = '$ Value'" />

我使用CSS来解决这个问题。这里是小提琴:http://jsfiddle.net/Jack_anderson/3bg7ta8h/2/

<head>
<style>
#value {
background:no-repeat url('image_src');
padding-left:.55em;
}
</style>
</head>
<body>
<div style="width: 40%; float: right;">                    
<input id="value" type="text" name="value" placeholder="Value" value=""     required="required" />
</div>
</body>
相关文章：