Question

好的，所以我试图建立一个链接列表，根据你选择的链接，它会显示一个不同的div容器。我想要它，所以一次只能显示一个div。我有代码，它正在我喜欢的工作，然而，当我在IE中加载它时，它不会工作。我听说过日志在这方面发挥了作用。如何使这个代码IE兼容，或者如果你有另一个可行的解决方案，我也可以听到它。

我的代码：

    <head>
    <title>Example</title>
    </head>
    <body>

    <!--Footer and Navigation Div's-->
    <div id="bg"><img src="images/bg.jpg" alt=""></div>
        <div id="footer">
            <p><span>Menu</span></p>
                <div id="nav">
                    <ul><a href="#">Link 1</a></ul>
                    <ul><a href="#">Link 2</a></ul>
                    <ul><a href="#">Link 3</a></ul>
                    <ul><a href="#">Link 4</a></ul>
                </div>
        </div>

    <!--END Footer and Navigation Div's-->

    <div class="parent">
        <div class="a">
            <p>this is a</p>
        </div>   
        <div class="b">
            <p>this is b</p>
        </div>
        <div class="c">
            <p>this is c</p>
        </div>
        <div class="d">
            <p>this is d</p>
        </div>
    </div>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
    <script>
    $('.parent  div').hide();

    $('#nav a').click(function() {
        console.log($(this).index('a'));
        var $div = $('.parent > div').eq($(this).index('#nav a'));
        $div.show();
        $('.parent > div').not($div).hide();
    });
    </script>
    </body>
    </html>

Answer 1

这是你应该学习jQuery的第一件事。始终使用$（document）.ready ...示例：

<script>
    $(document).ready(function() {
        $('.parent  div').hide();

        $('#nav a').click(function() {
            console.log($(this).index('a'));
            var $div = $('.parent > div').eq($(this).index('#nav a'));
            $div.show();
            $('.parent > div').not($div).hide();
        });
    });
</script>

Answer 2

尝试

$('#nav a').live('click',function() {

或

$('#nav a').bind('click',function() {

Jquery不在IE7工作吗？

2 个答案: