Question

所以我有两个不同的脚本。这两个脚本都可以单独工作，但是当我将两个脚本添加到页面时都没有。

我使用AJAX切换页面，但我还希望jQuery突出显示我点击的链接，以便它可以显示“活动”页面。

我的HTML：

<nav>
    <ul id="navUl">
        <li class="active"><a href="#">test1</a></li>
        <li ><a href="#">test2</a></li>
    </ul>
</nav>
<div id="result">
    <div id="content">
        <p>random content</p>
    </div>
</div>

我的AJAX / jQuery

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<script>
    (function($){
        $('nav a').click(function(){

            var href = $(this).attr('href')+' #content';

            $('#result').load(href);

            return false;
        });
    })(jQuery);
</script>

这很有效，但当我将其添加到脚本中时，会突出显示所选页面，然后我的AJAX不再起作用了。

$(function() {
    $( '#navUl li' ).on( 'click', function() {
        $( this ).parent().find( 'li.active' ).removeClass( 'active' );
        $( this ).addClass( 'active' );
    });
});

Answer 1

您从nav a点击事件返回false，这会阻止事件冒泡到li。

更改为：

(function($){
        $('nav a').click(function(e){

            e.preventDefault();

            var href = $(this).attr('href')+' #content';

            $('#result').load(href);
        });
    })(jQuery);

添加类不适用于我的ajax

1 个答案: