Mootools:Clicked要素で動作するようにAjaxコールバックを作る
-
21-12-2019 - |
質問
数回の赤い色のリンクを持っているとし、それらにクリックイベントを追加したいとします。緑に変更されます。
のようなものが欲しい$$('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]);
}
);
.
愚かな質問であれば申し訳ありません。賢明なものにタイトルを編集してください。
解決
問題は、イベントハンドラ内の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;
}
.
例
所属していません StackOverflow