为什么鼠标在table里移动时会触发onmouseout事件呢？想不通！

Question

<div id="div1" name="menutable" style="display:none;" onmouseout="javascript:hideMenu('div1')">
                        <table style="width:100%;background-color:#FFCC66;border-collapse:collapse;" border="1">
                            <tr>
                                <td style="height:24px">选项一</td>
                            </tr>
                            <tr>
                                <td style="height:24px">选项二</td>
                            </tr>
                            <tr>
                                <td style="height:24px">选项三</td>
                            </tr>
                            <tr>
                                <td style="height:24px">选项四</td>
                            </tr>
                            <tr>
                                <td style="height:24px">选项五</td>
                            </tr>
                        </table>
                        <%--选项一<br />
                        选项二<br />
                        选项三<br />
                        选项四<br />
                        选项五<br />--%>
                    </div>如果在div里使用
<br />
选项二<br />
选项三<br />
选项四<br />
选项五<br />
的话就不会触发onmouseout事件，为什么？

Answer 1

因为你从一个对象移到另一个对象上. 对于第一个对象来说, 就是out了.

Answer 2

我现在改成onmouseleave就好了。。VS里怎么说onmouseleave不是有效属性呢?

Answer 3

谁说不行了？<script type="text/javascript">
        function hideMenu(obj)
        {
            document.getElementById(obj).style.display = "none";
        }
        function showMenu(obj)
        {
            document.getElementById(obj).style.display = "block";
        }
</script><div id="div2" onmouseover="javascript:showMenu('div1')" style="border:solid 1px Red;width:100px;height:50px;">show</div><div id="div1" name="menutable" style="display:none;" onmouseout="javascript:hideMenu('div1')">
                        <%--<table style="width:100%;background-color:#FFCC66;border-collapse:collapse;" border="1">
                            <tr>
                                <td style="height:24px">选项一</td>
                            </tr>
                            <tr>
                                <td style="height:24px">选项二</td>
                            </tr>
                            <tr>
                                <td style="height:24px">选项三</td>
                            </tr>
                            <tr>
                                <td style="height:24px">选项四</td>
                            </tr>
                            <tr>
                                <td style="height:24px">选项五</td>
                            </tr>
                        </table>--%>                        选项一<br />
                        选项二<br />
                        选项三<br />
                        选项四<br />
                        选项五<br />
</div>

Answer 4

div里面不放table这样是可以的