javascript - 网页在IE中呈现空白

This question is unlikely to help any future visitors; it is only relevant to a small geographic area, a specific moment in time, or an extraordinarily narrow situation that is not generally applicable to the worldwide audience of the internet. For help making this question more broadly applicable, visit the help center。




                6年前关闭。




我今天在这里有跨浏览器问题。我的代码可以完美地在Chrome和Firefox上呈现，但是可以在IE上呈现空白页面。

每当我在IE中进行调试时，jQuery代码段上都会触发一个错误，提示“ $未定义”或“预期对象”。

设定：

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript" src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<script type="text/javascript" src="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.js"></script>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.css" />
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
<link rel="stylesheet" type="text/css" href="http://jquerymobile.com/demos/1.0a4.1/experiments/ui-datepicker/jquery.ui.datepicker.mobile.css"></link>
<script src="http://jquerymobile.com/demos/1.0a4.1/experiments/ui-datepicker/jQuery.ui.datepicker.js"></script>
<script src="http://jquerymobile.com/demos/1.0a4.1/experiments/ui-datepicker/jquery.ui.datepicker.mobile.js"></script>

这是触发错误的jQuery片段之一：

$(function(){
    $("#accordionDemo").accordion({
        header : "h3",
        active: false,
        alwaysOpen:false,
        fillSpace:false,
        collapsible:true,
    });
});

html非常简单。我只是在体内使用脚本
$('#home').append('<div id="accordionDemo"><b>Sample Code</b></div>');

顺便说一下，我在div中有代码。我只是写了一个示例代码作为占位符。

我对jQuery有点陌生，但我想我缺少一些简单的东西。但是，我真的找不到问题。请帮我在这里。让我知道是否需要在问题中包括更多细节。谢谢你这么。

更新
这是完整的代码。为了安全起见，我更改了变量名称。我还删除了一些部分并进行了压缩，但是主要要点/布局仍然存在。

<!DOCTYPE HTML>
<html>
    <head>
        <meta name="viewport" content="width=device-width,initial-scale=1" charset ="UTF-8">
        <title>Handshake Protocol</title>
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
        <script type="text/javascript" src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
        <script type="text/javascript" src="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.js"></script>
        <link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.css" />
        <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
        <script type="text/javascript">
            //reset type=date inputs to text
            $( document ).bind( "mobileinit", function(){
                $.mobile.page.prototype.options.degradeInputs.date = true;
            });
        </script>
        <link rel="stylesheet" type="text/css" href="http://jquerymobile.com/demos/1.0a4.1/experiments/ui-datepicker/jquery.ui.datepicker.mobile.css"></link>
        <script src="http://jquerymobile.com/demos/1.0a4.1/experiments/ui-datepicker/jQuery.ui.datepicker.js"></script>
        <script src="http://jquerymobile.com/demos/1.0a4.1/experiments/ui-datepicker/jquery.ui.datepicker.mobile.js"></script>
        <script type="text/javascript">
            var i=0;
            var xmlFinal;
            var accordianHtml="";
            var accordianHtmlStart='<div id="accordionDemo">';
            var accordianHtmlEnd="</div>";

            $(function(){
                $("#accordionDemo").accordion({
                    header : "h3",
                    active: false,
                    alwaysOpen:false,
                    fillSpace:false,
                    collapsible:true
                });
            });

            $(xmld).find('dummymain').each(function(){ //i am getting this xml file off the net, i have hidden the link for security reasons

                accordianHtml += '<h3>'+dummyname+'</h3><div>';
                accordianHtml += "<button data-inline='true' data-mini='true' data-role='button'>Start</button>";
                accordianHtml += "<button data-inline='true' data-mini='true' data-role='button'>Stop</button>";
                accordianHtml += "</div>";
            });

            var accordianHtmlFinal = accordianHtmlStart + accordianHtml + accordianHtmlEnd;
        </script>
    </head>
    <body>
        <div data-role="page" id="home">
            <script>
                $('#home').append('<div data-role="header" id="header"> <h1>dummy Dashboard</h1> </div>');
                $('#home').append(accordianHtmlFinal);
                $('#home').append('<input type="button" value="Save" onlick="send2dummyServer()"/>');
            </script>
        </div>
    </body>
</html>

最佳答案

$('#home').append('<div id="accordionDemo"><b>Sample Code</b></div>');

注意引号。

关于javascript - 网页在IE中呈现空白，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/17171755/