Question

我有以下html应该创建一个飞出菜单。在Chrome和FF中，它按预期工作。不幸的是，在IE8中，我得到的只是一个小小的白色盒子和放大器。在IE9中它什么都不做。我使用了开发人员工具（F12）并监控了网络，该网络显示了以下成功的 GET - ＆gt; /icenter/config/wwcMenuContent.html GET 304 text/html 473 B 109 ms JS Library XMLHttpRequest 156 0 109 0 0 47

有人帮助我吗？

MenuControl

<html xmlns="http://www.w3.org/1999/xhtml">
<head>          
        <script type="text/javascript" src="jquery-1.3.2.min.js"></script>
        <script type="text/javascript" src="fg.menu.js"></script>

    <link type="text/css" href="fg.menu.css" media="screen" rel="stylesheet"/>
    <link type="text/css" href="theme/ui.all.css" media="screen" rel="stylesheet"/>

    <!-- style exceptions for IE 6 -->
    <!--[if IE 6]>
    <style type="text/css">
        .fg-menu-ipod .fg-menu li { width: 95%; }
        .fg-menu-ipod .ui-widget-content { border:0; }
    </style>
    <![endif]-->    

    <script type="text/javascript">    
    $(function(){    
        // or from an external source
        $.get('wwcMenuContent.html', function(data){ // grab content from another page
            $('#hierarchy').menu({
                autoShow: true,  //SSLOAN set to auto show
                content: data,
                backLink: false,
                crumbDefaultText: ' '
            });
        });
    });
    </script>
</head>
<body>
    <!-- We override there stylesheet here so the div doesn't appear to the eye -->
    <div id="hierarchy" style="border:solid 1px white; width:0px;"><img style="width:15px; height:10px; vertical-align:top; border:none;" alt=" " src="data:image/gif;base64,R0lGODlhAQABAJH/AP///wAAAMDAwAAAACH5BAEAAAIALAAAAAABAAEAQAICVAEAOw=="/></div>
</body>

MenuContent

<ul>
<li><a href="#">AODA/MH Center</a>
    <ul>
        <li><a href="http://wwcshare/icenter/SitePages/AODA%20Information.aspx">AODA Information</a></li>
        <li><a href="http://wwcshare/icenter/SitePages/Community%20Resources.aspx">Community Resources</a></li>
        <li><a href="http://wwcshare/icenter/SitePages/Consultant%20Schedules.aspx">Consultant Schedules</a>
            <ul>
                <li><a href="http://en.wikipedia.org/wiki/Chuck_norris">Chuck Norris</a></li>
                <li><a href="http://en.wikipedia.org/wiki/Darth_vader">Darth Vader</a></li>
                <li><a href="http://en.wikipedia.org/wiki/Jackie_chan">Jackie Chan</a></li>
                <li><a href="http://en.wikipedia.org/wiki/Steve_jobs">Steve Jobs</a></li>
            </ul>
        </li>
        <li><a href="http://wwcshare/icenter/SitePages/Guidelines,%20Policies%20and%20Service%20Expectations.aspx">Guidelines, Policies, and Service Expectations</a></li>
        <li><a href="http://wwcshare/icenter/SitePages/Mental%20Health%20Information.aspx">Mental Health Information</a></li>
        <li><a href="http://wwcshare/icenter/SitePages/Tools%20and%20Forms.aspx">Tools and Forms</a></li>
        <li><a href="http://wwcshare/icenter/SitePages/Topics,%20Schedules%20and%20Sign-Up%20Sheets.aspx">Topis, Schedules, and Sign-Up Sheets</a></li>
    </ul>
</li>
<li><a href="#">Case Management Center</a></li>
<li><a href="#">Forms Center</a></li>
<li><a href="#">Functional Screen Center</a></li>
<li><a href="#">MCO Benefit Package Center</a></li>
<li><a href="#">Self-Directed Supports Center</a></li>
<li><a href="#">Social Service Specialist Center<a></li>
</ul>

好主，你不是在开玩笑，IE很挑剔。我的上一个<a></a>错过了/。这导致整个页面无法显示。感谢。

Answer 1

您的帖子中是否遗漏了最后一行，或者您实际上是否遗漏了结束</ul>。如果是这样，那就可以了。

对于通过AJAX方法进入的代码的正确有效性，IE比其他浏览器更加繁琐。始终确保它完全有效，否则IE将无所事事。

Answer 2

问题可能是由于缺少<!DOCTYPE声明。这使得IE以Quirks模式运行，导致意外行为和缺乏功能。尝试将正确的<!DOCTYPE添加到HTML文件中，看看这是否有所不同。

我的页面不在IE中显示，但在Chrome和Firefox中显示？

MenuControl

MenuContent

2 个答案: