Question

我正在使用jquery为点击的li分配一个活动类。

代码在codepen和jsfiddle中完美运行，但在我的实际站点上却没有。

在网站上，内容会显示点击li时的内容，但不显示border-bottom，在检查代码时，单击时未设置活动类。

jquery正在加载正常，因为另一段代码工作正常吗？

 @foreach($albums as $album)
      <tr>
        <td>{{ $album->album_name }}</td>
        <td>{{ $album->category->title }}</td>
        <td>{{ $album->created_at }}</td>
      </tr>
    @endforeach

Answer 1

看来这个

$(document).ready(function(){

    $('#wayfindermenu a').click(function(e){
       hideContentDivs();
       var tmp_div = $(this).parent().index();
       $('.maincontent div').eq(tmp_div).show();
    });

    function hideContentDivs(){
       // no need to iterate
       /*$('.maincontent div').each(function(){
           $(this).hide();
       });*/
       $('.maincontent div').hide();
    }

    hideContentDivs();

    // This also needs to be in the DOMready wrapper
    // but in any case, there's a better way to write this bit
    /*var selector = '#wayfindermenu li';
    $(selector).on('click', function(){
        $(selector).removeClass('active');
        $(this).addClass('active');
    });*/
    $('#wayfindermenu li').on('click', function(){
        $(this).addClass('active').siblings().removeClass('active');
    });

});

在DOMready包装器之外，也许codepen添加了自己的包装器

这就是缩进很重要的原因

document events

你还应该声明你的功能是否干净。

jquery活动类在代码笔中工作但不是实际站点吗？

1 个答案: