Senden eines jQuery-Ajax-Formulars mit zwei Senden-Schaltflächen

Ich habe ein Formular, das so aussieht:

<form action="/vote/" method="post" class="vote_form">
    <input type="hidden" name="question_id" value="10" />
    <input type="image" src="vote_down.png" class="vote_down" name="submit" value="down" />
    <input type="image" src="vote_up.png" class="vote_up" name="submit" value="up" />
</form>

Wenn ich mich an die Vorlage des Formulars binde ($("vote_form").submit()Ich habe anscheinend keinen Zugriff auf das Bild, auf das der Benutzer geklickt hat. Also versuche ich mich daran zu binden, auf das Bild selbst zu klicken ($(".vote_down, .vote_up").click()), der immer das Formular absendet, egal ob ich es versuche

falsch zurückgeben;event.stopPropogation (); oderevent.preventDefault ();

denn all das sind Formereignisse.

Soll ich mein $ .post () an das form.submit () -Ereignis anhängen und wenn ja, wie kann ich feststellen, auf welche Eingabe der Benutzer geklickt hat, oder

Sollte ich mein $ .post () an das Bild anhängen, klicken Sie, und wenn ja, wie verhindere ich, dass das Formular ebenfalls gesendet wird.

So sieht mein jQuery-Code jetzt aus:

$(".vote_up, .vote_down").click(function (event) {
    $form = $(this).parent("form");
    $.post($form.attr("action"), $form.find("input").serialize() + {
        'submit': $(this).attr("value")
    }, function (data) {
        // do something with data
    });
    return false; // <--- This doesn't prevent form from submitting; what does!?
});

Antworten auf die Frage(8)

Ihre Antwort auf die Frage