html~求助

做个页面小功能，如下代码，想生成对话框，然后点击对话框内容能跳转页面，点击其他地方，对话框消失。
拌蒜了~~求指点~
<div id="div3" onclick="test()">fff33</div>
<div id="div4" tabindex="0" onblur="hide()" style="display:none;width:200px;height:120px;">
    <ul>
        <li><a href='http://www.baidu.com'>123</a></li>
        <li><a href='http://www.baidu.com'>223</a></li>
        <li><a href='http://www.baidu.com'>323</a></li>
    </ul>
</div>
<script type="text/javascript">
function test () {
 document.getElementById("div4").style.display="";
 document.getElementById("div4").focus();
}function hide () {
 var div2=document.getElementById("div4");
 div2.style.display='none';
}
</script>
上面代码 能收缩弹出框，但是点击不了链接了~

解决方案 »

  1.   

    http://topic.csdn.net/u/20120115/21/9d2a9c6c-1c14-4ce1-9394-9cec7def6da2.html
      

  2.   

     不是一个问题，不使iframe，不使jquery，
      

  3.   

    编辑这玩意思路要比语句重要<body>
    其他内容
    其他内容
    其他内容
    其他内容
    其他内容
    其他内容
    其他内容
    其他内容
    其他内容
    其他内容
    <div id="d">
    DIV DIV DIV <br/>
    DIV DIV DIV <br/>
    DIV DIV DIV <br/>
    </div>
    <script language="javascript">
    document.onclick = function(event){
    event = event || window.event;
    var which = event.srcElement || event.target;
        var d = document.getElementById("d");
        if(which != d){
            d.style.display="none";
        }
    }
    </script>
    </body>