0

jQuery でページネーション システムを設計しようとしています。私が立ち往生しているビットは、別のページ番号のリンクをクリックしたときに、「アクティブな」クラスを新しくクリックしたページに移動したいということです。

例のページでは、「1」にアクティブなクラスがあります。「2」をクリックすると、アクティブなクラスが「2」に移動し、「1」から削除されます。

http://jsfiddle.net/qKyNL/24/

$('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
            // TO DO: Set number as active class
        },
        error: function (x, t, m) {
            if (t === "timeout") {
                alert("Request timeout");
            } else {
                alert('Request error');
            }
        },
        complete: function () {
            $('#content').fadeTo(500, 1);
        }
    });    
});

私はjQueryにまったく慣れていないので、助けが必要です。これを行う方法について誰かが私にいくつかのガイダンスを教えてもらえますか?

4

2 に答える 2

1

addClassメソッドhereとremoveClassメソッドhereを確認できます

于 2013-08-31T22:19:16.040 に答える
0

現在アクティブな li を削除し、クリックしたクラスにアクティブなクラスを追加します。これらの 2 行をクリック イベント ハンドラーに追加します。

$('#pagination li.active').removeClass("active");
$(this).parent().addClass("active");
于 2013-08-31T22:40:36.280 に答える