在谷歌,或者火狐浏览器中当输入框获得焦点,拖动其他div的输入框不会触发input的失去焦点事件,但是在IE中会触发,请问如何解决?
想要的效果是当我输入框获得焦点展示div时,拖动div的滚动条不要触发失去焦点事件,div仍能展示而不是被隐藏。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<style type="text/css">
* {
margin: 0;
padding: 0;
list-style: none;
}
#divshow {
display: none;
width: 200px;
height: 100px;
overflow: hidden;
overflow-y: auto;
}
#divinner {
width: 200px;
height: 400px;
background-color: blueviolet;
}
.scrolls {
height: 3000px;
width: 500px;
float: left;
}
#box {
width: 600px;
overflow: hidden;
overflow-y: auto;
height: 500px;
}
</style>
</head>
<body>
<div id="box">
<div class="scrolls">
<input type="text" name="boxa" id="boxa" value="" />
<div class="div1" id="divshow">
<div id="divinner">
这是里面的内容
</div>
</div>
</div>
</div>
</body>
</html>
<script type="text/javascript">
var xx = document.all
console.log(xx);
var inp = document.getElementById("boxa");
inp.onfocus = function() {
document.getElementById("divshow").style.display = "block";
}
inp.onblur = function() {
console.log("失去焦点");
document.getElementById("divshow").style.display = "none";
}
</script>