herramientas moo:hacer devoluciones de llamada ajax para trabajar con el elemento en el que se hizo clic

Question

Supongamos que tengo varios enlaces de color rojo y quiero agregarles un evento de clic de modo que cuando se active, envíe el atributo HREF del enlace al servidor (como una solicitud AJAX) y, en caso de éxito, se cambiará el color del enlace. a verde.Quiero algo como:

$$('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]);
    }
);

Lo siento si la pregunta es tonta.edite el título por uno sensato.

Answer 1

El problema aquí es que this dentro del controlador de eventos no es lo mismo que this dentro de la clase de solicitud.Entonces lo que normalmente se hace es cambiar la referencia a this en una nueva variable, por ejemplo var self = this.

Después de eso puedes usar self.setStyle('color', 'green');

Por cierto, una sugerencia, lo mejor sería tener también una clase para el color verde y cambiarlas en el momento del clic.

Así que aquí hay una sugerencia de código que sería:

$$('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);
});

y usando en el CSS algo como:

.green {
    color: green;
}

Ejemplo