需求
有这样一个搜索的遮罩层,希望点击除输入框和搜索按钮外的任何位置,都可以将遮罩层关闭。
代码
HTML:
<div class="serachMask">
<div class="div_my_zzk">
<input type="text" class="input_my_zzk">
<input type="button" value="搜索" class="btn_my_zzk">
</div>
</div>
js:
$(".serachMask").on("click",function(e) {
if(e.target.className !== "input_my_zzk" && e.target.className !== "btn_my_zzk") {
$(".serachMask").fadeOut();
}
})
js代码的核心就是给遮罩层添加点击事件时,增加个判断条件,当点击的元素不是输入框和搜索按钮时,那么我们让遮罩层隐藏。