HTML问题解决笔记

<div id="hpic">
<img src="images/1.jpg"/>
<img src="images/2.jpg"/>
<img src="images/3.jpg"/>
</div>
<script>
$(function(){
var img = $("#hpic img");
img.each(function(e,img){
var src = img.src.split('/').pop();
console.log(src);
});
})
</script>

<div class="hk1">
<div>-----------------------◆</div>
<div class="hk2">居中散开</div>
<div>◆-----------------------</div>
</div>
<style>
.hk1{
margin: 0 auto;
width: 300px;height: 100px;
background-color: orange;
display: flex;
display: -webkit-flex; /* Safari */
flex-flow:row nowrap;
justify-content:center; /* 水平居中 */
align-items:center; /* 垂直居中 */
white-space:nowrap; /* 不换行 */
overflow: hidden;
}
.hk1 .hk2{ margin: 20px }
</style>

1、简单版
<input onkeyup="if(isNaN(value))execCommand('undo')">

2、正则表达式替换
<input name="num">
<script>
$("input[name='num']").on("input",function(){
//先把非数字的都替换掉，除了数字和.
this.value =this.value.replace(/[^\d.]/g,"");
//必须保证第一个为数字而不是.
this.value = this.value.replace(/^\./g,"");
//保证只有出现一个.而没有多个.
this.value = this.value.replace(/\.{2,}/g,".");
console.log(this.value);
//保证.只出现一次，而不能出现两次以上
return this.value = this.value.replace(".","$#$").replace(/\./g,"").replace("$#$",".");
})
</script>

<style>
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button{
-webkit-appearance: none !important; /* chrome */
}
input[type="number"]{-moz-appearance:textfield;} /* Firefox */
</style>