我希望用户输入带有“cm”、“kg”或“$”等单位的数字。这可以在 jQuery UI 中完成:Example http://jqueryui.com/spinner/#currency
但是,我想用纯html实现它,例如:
input{
display: inline;
}
div.euro-sign::after{
content: "€";
margin-left: -40px;
}
<div><input placeholder="5 €" type="number" step="1"></div>
<div><input placeholder="5 €" type="number" step="1" unit="€"></div><!-- NOT working -->
<div class="euro-sign"><input placeholder="5" type="number" step="1"></div><!-- Workaround -->
是否有更原生的方法(例如示例 2)或者我是否必须实施解决方法(示例 3)?
$(".original input").on("change", function(){
$(".duplicate input").val(this.value + '€');
});
$(".duplicate input").on("change", function(){
$(".original input").val(this.value.substring(0, this.value.length - 1));
});
.duplicate {
position: relative;
top: -20px;
left: 2px;
float: left;
}
.duplicate input {
width: 145px;
border: none;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<div class="euro-sign">
<div class="original">
<input type="number" step="1"/>
</div>
<div class="duplicate">
<input type="text" value="0€"/>
</div>
</div>
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)