Question

我正在尝试使用jquery中的getScript函数加载jquery文件。在Chrome和Firefox中都可以使用。但只是，它只有一个空白页面显示给我。 getScript函数在ajax调用之后使用，并为此ajax调用的加载内容添加交互性。

在使用Internet Explorer时，有什么方法可以动态加载jquery文件吗？

<html>
<head>
    <link rel = "stylesheet" type="text/css" href="restaurant.css"></link>
    <script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <script src="restaurant.js"></script>
</head>
<body>
    <div id="banner"></div>
    <div id="cart"></div>
    <ul id="headbar">
        <li id="aboutButton">About</li>
        <li id="menuButton">Our Menus</li>
        <li id="directionhoursButton">Direction&Hours</li>
        <li id="orderButton">Orders</li>
        <li id="reviewsButton">Reviews</li>
        <li id="contactsButton">Contacts</li>
    </ul>
    <div id="display"></div>
</body>

 $(document).ready(function(){
    $('#aboutButton').click(function(){
        $.ajax({
            type:'GET',
            url:'about-ajax-return.php',
            dataType:'html',
            cache:true,
            success: function(data, textStatus){
                $('#display').html(data);
            },
            error: function(xhr, textStatus, errorThrown){
                $('#display').html("<p class='error'>Unable to retrieve information. Status: " + textStatus + "  Error: " + errorThrown + "</p>");
            }
        });
    });
    $('#menuButton').click(function(){
        $.ajax({
            type:'GET',
            url:'menu-ajax-return.php',
            dataType:'html',
            cache:true,
            success: function(data, textStatus){
                $('#display').html(data);
            },
            error: function(xhr, textStatus, errorThrown){
                $('#display').html("<p class='error'>Unable to retrieve information. Status: " + textStatus + "  Error: " + errorThrown + "</p>");
            }
        });
        $('head').append('<link rel = "stylesheet" type="text/css" href="menu-ajax-return.css"></link>');
        $.getScript("menu-ajax-return.js");
    });});

下面是menu-ajax-return.js，我尝试使用getScript加载

    $(document).ready(function(){
    $('#buttonPizza').click(function(){
        $('.sandwiches')
            .css("display", "none");
        $('.pasta')
            .css("display", "none");
        $('.pizza')
            .css("display", "inline");  
    });
    $('#buttonSandwiches').click(function(){
        $('.sandwiches')
            .css("display", "initial");
        $('.pasta')
            .css("display", "none");
        $('.pizza')
            .css("display", "none");    
    });
    $('#buttonPasta').click(function(){
        $('.sandwiches')
            .css("display", "none");
        $('.pasta')
            .css("display", "initial");
        $('.pizza')
            .css("display", "none");    
    });

    $('#buttonPizza').trigger("click");
});

    <div id="nav">
    <ul class="menuPage" id="foodTypeMenu">
        <li id="buttonPizza">Pizzas!</li>
        <li id="buttonSandwiches">Sandwiches & Paninis</li>
        <li id="buttonPasta">Pastas</li>
        <li id="buttonEntrees">Entr&eacute;es</li>
        <li id="buttonAppetizer">Appetizers</li>
        <li id="buttonWrap">Wraps</li>
        <li id="buttonSoupSalad">Soup & Salad</li>
        <li id="buttonSideorder">Side Orders</li>
        <li id="buttonDesert">Deserts</li>
        <li id="buttonSpecialities">House Specialities</li>
    </ul>
</div>

如何将jquery动态加载到ie？

0 个答案: