Jquery-Ajax - Antwort soll html ersetzen

Fange ich an Ajax und ich habe ein paar Probleme. Ich habe eine Seite mit einer Liste containning einige video-thumbnails, wenn Sie rollover auf Sie, es gibt ein "ich mag nicht dieses" Symbol zeigt. Das ist getan. Jetzt, wo iam-dass problem ist:

Wenn Sie auf dieses Symbol, um den video-Titel, thumbnail & info sollte verschwinden und ein anderes video zu zeigen.

Hier mein Ajax-code

function ThumbsDown(id,sort,page) {
$.ajax({
    url: "/change/videos/"+id+"/thumbsdown/",
    type: "POST",
    data: {
        "sort": sort?sort:"",
        "page": page?page:""
    },
    complete: function(result) {
         //Instead of calling the div name, I need to be able to target it with $(this) and .parent() to make sure only 1 video change, but for now I only want the response to replace the video
         $("#content .videoList ul li.videoBox").html(result);             
    }
});
}

Ist die Anforderung der Arbeit, im gettin a (200 OK) Antwort. Und es ist die Rückkehr mir den HTML-code-block für das neue video.

Das problem ist, , wenn ich auf das Symbol klicken, werden alle den html-Code in das div-Element Weg. Ich habe einen leeren tag, so dass ich denke, es ist interpretiert als "leer". Aber in meinem firebug .Net tab, ich kann deutlich sehen, dass es eine Antwort.

Jede Hilfe bitte? SCHON BEHOBEN, DANK

* * * * EDIT

Nun im Probleme zum Ziel die spezifische div mit$(this) und den Eltern(). Kann mir da jemand helfen?

Ich soll die li #videoBox

<li class="videoBox recommended">
   <div class="spacer" style="display: block;"></div>
   <div class="features">
      <div>
         <a class="dislike_black" title="I dislike this" onclick="ThumbsDown(30835, 'relevance', '1');"></a>
      </div>
    ...

Ich habe versucht, und es funktioniert nicht.

    success: function(data) {
        $("#content .videoList ul li.videoBox").html(data); //this IS WORKING, but replacing ALL the thumbs
        $(this).parents("li.videoBox").html(data); //THIS IS NOT

Was ich ich falsch mache?

InformationsquelleAutor Lelly | 2012-01-26

  1. 3

    Des Problems, das Sie haben, ist, dass du mit "abgeschlossen" - callback-Funktion. Dies kann irreführend sein, aber das callback soll aufgerufen werden, nachdem ein Erfolg oder ein Misserfolg. Es ist mehr für die Bereinigung, und nicht erhalten die Daten als Antwort, die Sie erwarten würden. Im Grunde, alles, was Sie tun müssen, ist die Veränderung "vollständig", um "Erfolg", und Sie erhalten das erwartete Ergebnis.

    Allerdings habe ich persönlich nicht empfehlen die Verwendung der Ajax-Funktion, denn wie es aussieht ist es völlig unnötig. Die Ajax-Funktion existiert hauptsächlich für komplexe Transaktionen, und es sieht aus wie Sie haben eine ziemlich einfache. Was ich vorschlagen, ist mit der "shortcut" - Funktion, die jQuery bietet, etwa so:

    $.post(`/change/videos/${id}/thumbsdown/`, {sort:'', page:''}, function(result){
    //Instead of calling the div name, I need to be able to target it
    //with $(this) and .parent() to make sure only 1 video change,
    //but for now I only want the response to replace the video

     $('#content .videoList ul li.videoBox').html(result);
}, 'html');
    Vielen Dank! Wusste nicht, dass die Reaktion auf Erfolg / komplett unterschiedlich war!
    Ich habe ein anderes problem, Geist-Kontrolle auf meinen ersten post bitte?

    InformationsquelleAutor NeoNexus DeMortis

  2. 1

    Ändern von complete to success

    function ThumbsDown(id,sort,page) {
$.ajax({
    url: "/change/videos/"+id+"/thumbsdown/",
    type: "POST",
    data: {
        "sort": sort?sort:"",
        "page": page?page:""
    },
    success: function(result) {
         //Instead of calling the div name, I need to be able to target it with $(this) and .parent() to make sure only 1 video change, but for now I only want the response to replace the video
         $("#content .videoList ul li.videoBox").html(result);             
    }
});
}

    den complete callback-im Gegensatz zu den Erfolg nicht bekommen, die Daten parameter nur die jqXHR parameter.

    InformationsquelleAutor gdoron

Schreibe einen Kommentar