<html>
<head>
<style type="text/css">
*{
margin:0;
padding:0}
div{
width:100px;
height:30px;
position:absolute;
top:30%;
left:30%;
background:#1d1}
#wrapper{
background:#d11;}
</style>
<script type="text/javascript">
window.onload = function () {
var wrapper = document.getElementById('wrapper');
document.addEventListener('mousedown', function () { alert('Вы кликнули вне дива') }, false);
wrapper.addEventListener('mousedown', function (e) { e.stopPropagation() }, false);
}
</script>
</head>
<body>
<div id="wrapper">
<select>
<option>пункт 1</option>
<option>пункт 2</option>
<option>пункт 3</option>
<option>пункт 4</option>
<option>пункт 5</option>
<option>пункт 6</option>
</select>
</div>
</body>
</html>