Question

突然之间，我无意中导致一段代码不再起作用。我使用以下内容来显示并同时隐藏同一网站文件中的内容：

    <script type="text/javascript">
        $('.tabs').on('click', 'a', function(){
            $('section').hide();
            $($(this).attr('data-url')).show();
            var $this = $(this),
            $ul = $this.parents('ul');
            $ul.find('a').removeClass('active');
            $this.addClass('active');
        }); 
    </script>

以下是显示和隐藏的html代码：

    <ul class="tabs">
        <li><a class="active" href="javascript:void(0);" data-url="#content1">Content1</a></li>
        <li><a href="javascript:void(0);"  data-url="#content2">Content2</a></li>
        <li><a href="javascript:void(0);" data-url="#content3">Content3</a></li>
    </ul>

        <section id="content1">
            Some content 1
        </section>

        <section id="content2">
            Some content 2
        </section>

        <section id="content3">
            Some content 3
        </section>

以下是CSS代码：

section {
    display: none;
}

section:first-of-type {
    display: block;
}

ul.tabs {
    list-style: none;
    text-align: center;
}

ul.tabs li {
    display: inline-block;
}

ul.tabs li a {
    display: inline-block;
    width: 100px;
    margin-right: 25px;
    margin-bottom: 25px;
    padding: 5px 5px 5px 5px;
    background-color: #ffffff;
    border: 1px;
    border-style: solid;
    border-color: #000000;
    text-align: center;
    text-decoration: none;
    color: #000000;
}

ul.tabs li a:hover {
    color: #349cf0;
}

ul.tabs li a.active {
    color: #349cf0;
}

我不知道为什么这突然停止了。现在我没有在网站上包含所有内容。你们中的任何人都可以向我解释一下可能会干扰代码吗？也许我不小心改变了js中的某些东西。我从别人那里收到了代码，但我自己也找不到任何错误。如果有人能够发现任何错误，我将非常感谢！

提前致谢

Answer 1

看起来有效：http://jsfiddle.net/L0Lnav2t/1/

<script type="text/javascript">
        $('.tabs').on('click', 'a', function(){
            $('section').hide();
            $($(this).attr('data-url')).show();
            var $this = $(this),
            $ul = $this.parents('ul');
            $ul.find('a').removeClass('active');
            $this.addClass('active');
        }); 
    </script>

我认为你的代码在初始化onclick监听器之前会导致另一个错误，导致它失效。

虽然它本身似乎很好但

js段功能不再有效

1 个答案: