Mootools：Clicked要素で動作するようにAjaxコールバックを作る

Question

数回の赤い色のリンクを持っているとし、それらにクリックイベントを追加したいとします。緑に変更されます。

のようなものが欲しい

$$('a.red').addEvent(
    "click",
    function () {
        new Request.JSON({
            url: 'script.php', 
            onSuccess: function(){
                [the link wich is clicked].setStyle('color', 'green');
                return false;
            }
        }).get("url="+[url of the link]);
    }
);

.

愚かな質問であれば申し訳ありません。賢明なものにタイトルを編集してください。

Answer 1

問題は、イベントハンドラ内のthisが要求クラス内のthisと同じではないことです。それで通常行われるのは、新しい変数のthisへの参照を変更することです。たとえば、var self = thisです。

それ以降はself.setStyle('color', 'green');

を使用できます。

提案は、緑色のクラスを持ち、クリック時にそれらを切り替えることになるでしょう。

だからここでコード提案は次のとおりです。

$$('a.red').addEvent("click", function (event) {
    var self = this;
    event.stop();
    new Request.JSON({
        url: 'script.php',
        onSuccess: function () {
            self.removeClass('red').addClass('green');
            return false; // I added event.stop(), presume that is what you meant. Do this line can be removed
        }
    }).get("url=" + self.href);
});

.

とCSSでの使用：

.green {
    color: green;
}

.

例