• IE8 form嵌套导致DIV重复显示

    今天在做页面的时候发现了个奇怪的现象,一段代码在IE8下DIV好像重复显示了。(下面两段是经过,可以无视直接跳到具体现象那一部分)

    在.NET群里面问了半天无果,雷锋QQ群众多朋友帮助下也没有找到原因,朋友们说也都是在IE8下有问题。检查这段代码的HTNL、CSS好多次,无果。无奈,一个个删这段代码之前、之后的代码,差不多删完了也同样没有找到。这段代码没问题啊。。。突然想到了这里面的form标签,对了,母版页也有个form!删了这段代码的form,OK!

    晕。。。真没想到竟然是这个原因!现在想来,我这么久才找到bug所在,一方面是因为这段代码之前在纯HTML页面的时候是没有问题的,而粘贴到VS2005后,VS2005必须有一个默认的form ,另一方面我用了母版页,我一直以为是母版页有bug(因为前两天我用母版页的时候出过问题)

    *********************************************

    具体现象

    如果代码的结构如下面所示

    <form id="form1">
        <div>
            <form id="form2">
            </form>
        </div>
    </form>
    

    那么这段div就会在下面重复显示一次(IE8下,只是重复显示一个空的div)

    而且如果这个div没有设置高度而设置了border,那么下面重复的效果就是条线,如果设置了高度,那么下面就是一个同样的div效果。

    下图显示的是div设置了高度,下面会重复显示一个同样的div

    总结

    粘贴代码的时候一定要注意环境,就像我之前虽然已经检测过代码无误,但是环境改变了,form嵌套问题就出在这里。另外问题出现的时候如果实在找不到原因,排除法很好。