标签：type 去除 使用 api var 小数 doc blur 方便
交互内容：
输入前显示“0.00”
移入后如果是“0.00”则清空内容
移入后如果是“*.00”则去除后面的“.00”以方便填写
移入后如果是“*.*0”则优化成“*.*”，即去掉最后面的“0”以方便填写
什么都没写移出后又再次填充“0.00”
只能输入数字和小数点
仅能输入一个小数点
仅保留后面两个小数点
1 <div class="mui-input-row"> 2 <label>金额<span>(元)</span></label> 3 <input type="tel" class="capital mui-input-clear" value="0.00"> 4 </div> 5 6 <style> 7 *{ 8 font-family:‘microsoft yahei‘; 9 height:30px; 10 line-height:30px; 11 } 12 input{ 13 width:100px; 14 border-radius:.3em; 15 border:1px solid #ccc; 16 padding-left:.5em; 17 margin-left:.3em; 18 } 19 </style> 20 21 <script> 22 /*投资本金仅能输入数字和小数点*/ 23 var precapital; 24 document.querySelector(‘.capital‘).addEventListener(‘focus‘, function() { 25 if (this.value == ‘0.00‘) { 26 this.value = ‘‘; 27 } else { 28 this.value = this.value.replace(/\.00/, ‘‘).replace(/(\.\d)0/,‘$1‘); 29 } 30 precapital = this.value; 31 }); 32 document.querySelector(‘.capital‘).addEventListener(‘keyup‘, function() { 33 34 this.value = this.value.replace(/^[\.]/, ‘‘).replace(/[^\d.]/g, ‘‘); 35 if (this.value.split(".").length - 1 > 1) { 36 this.value = precapital; 37 } 38 precapital = this.value; 39 }); 40 document.querySelector(‘.capital‘).addEventListener(‘blur‘, function() { 41 this.value = this.value.replace(/[\.]$/, ‘‘); 42 this.value = Number(this.value).toFixed(2); 43 }); 44 </script>
请使用手机"扫一扫"x
标签：type 去除 使用 api var 小数 doc blur 方便
原文地址：http://www.cnblogs.com/kousuke/p/perfect-input-for-money.html
