<form action="" id="form">
<input id="search" type="search" placeholder="請(qǐng)輸入客戶的手機(jī)或姓名" autocomplete="off">
</form>
submit事件要選擇form元素
$('#form').submit(function (e) {
e.preventDefault()
e.stopPropagation()
search()
}
設(shè)置input autocomplete="off"去掉彈出的下拉框;
將默認(rèn)的“x”隱藏掉:
input[type="search"]::-webkit-search-cancel-button{
display: none;
}
針對(duì)ios 設(shè)置樣式, 去除ios下input 橢圓形:
-webkit-appearance: none;
使用css3新增的屬性來控制input[type=search]
::-webkit-input-placeholder
::-webkit-search-cancel-button
重寫占位符樣式
input[type=search]::-webkit-input-placeholder{
color: blue;
}
重寫后面的小×樣式
input[type=search]::-webkit-search-cancel-button{
-webkit-appearance: none;//此處只是去掉默認(rèn)的小×
}
input[type=search]::-webkit-search-cancel-button{
-webkit-appearance: none;
position: relative;
height: 20px;
width: 20px;
border-radius: 50%;
background-color: #EBEBEB;
}
input[type=search]::-webkit-search-cancel-button:after{
position: absolute;
content: 'x';
left: 25%;
top: -12%;
font-size: 20px;
color: #fff;
}