我使用以下代码在清除文本的搜索栏中插入X.我还插入一个片段在Return上提交。我现在想添加一个片段来清除搜索&在Esc上提交。 (= = 27)。有任何想法吗?
<input type="text" id="fac" name="fac" class="form-control ui-autocomplete-input clearable" placeholder="Search">
<script>
jQuery(function($) {
function tog(v){return v?'addClass':'removeClass';}
$(document).on('input', '.clearable', function(){
$(this)[tog(this.value)]('x');
}).on('mousemove', '.x', function( e ){
$(this)[tog(this.offsetWidth-18 < e.clientX-this.getBoundingClientRect().left)]('onX');
}).on('click', '.onX', function(){
$(this).removeClass('x onX').val('');
fnexec(3);
});
});
$('#fac').keypress(function(event) {
if (event.which == 13) {
event.preventDefault();
fnexec(3);
}
});
</script>
这是CSS,以防任何人想要自己使用X部分 - 它非常漂亮!
.clearable{
background:url(http://i.imgur.com/z7ZSYjt.png) no-repeat right -10px center;
padding:3px 18px 3px 4px;
border-radius:3px;
transition: background 0.4s;
}
.clearable.x{
background-position: right 5px center;
}
.clearable.onX{
cursor:pointer;
}