<form action="" id="form">
<input id="search" type="search" placeholder="请输入客户的手机或姓名" autocomplete="off">
</form>
submit事件要选择form元素
$('#form').submit(function (e) {
e.preventDefault()
e.stopPropagation()
search()
}
设置input autocomplete="off"去掉弹出的下拉框;
将默认的“x”隐藏掉:
input[type="search"]::-webkit-search-cancel-button{
display: none;
}
针对ios 设置样式, 去除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;//此处只是去掉默认的小×
}
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;
}