Jquery应用类和删除类

时间:2013-09-01 10:33:02

标签: javascript jquery class

将活动类更改为当前单击的分页类的代码。删除它有效,但添加新类不起作用。

http://jsfiddle.net/spadez/qKyNL/35/

$('a').click(function(event){
    event.preventDefault();
    var number = $(this).attr('href');
    $.ajax({
        url: "/ajax_json_echo/",
        type: "GET",
        dataType: "json",
        timeout: 5000,
        beforeSend: function () {
            $('#content').fadeTo(500, 0.5);
        },
        success: function (data, textStatus) {
            // TO DO: Load in new content
            $('html, body').animate({
                scrollTop: '0px'
            }, 300);
            // TO DO: Change URL
            $('#pagination li.active').removeClass("active");            
            $(this).parent().addClass("active");
        },
        error: function (x, t, m) {
            if (t === "timeout") {
                alert("Request timeout");
            } else {
                alert('Request error');
            }
        },
        complete: function () {
            $('#content').fadeTo(500, 1);
        }
    });    
});

有谁能告诉我哪里出错了?

2 个答案:

答案 0 :(得分:2)

问题是this回调中的success不是您的元素。

你可以这样做:

$('a').click(function(event){
    var element = this; // <= save the clicked element in a variable
    event.preventDefault();
    var number = $(this).attr('href');
    $.ajax({
        ...
        success: function (data, textStatus) {
            ...
            $('#pagination li.active').removeClass("active");            
            $(element).parent().addClass("active"); // <= use it
        },
        ...
    });    
});

答案 1 :(得分:1)

这在ajax回调中并不是你所期望的那样。将其添加到您的ajax参数:

context: this,

不需要构建自定义对象保存系统并使代码更麻烦,因为jQuery已经具有此功能。

编辑:在这种情况下,它应该如下所示:

$('a').click(function(event){
    event.preventDefault();
    var number = $(this).attr('href');
    $.ajax({
        context: this,
        url: "/ajax_json_echo/",

...