2012-01-26 17 views
1

私はAjaxで始まり、問題のカップルがあります。私はいくつかのビデオサムネイルを含むリストを持つページを持っています。あなたがそれらにロールオーバーすると、「これは嫌いです」アイコンが表示されます。それは終わった。今どこに問題があるのですか:Jquery Ajax - 応答はhtmlに置き換えてください

アイコンをクリックすると、ビデオタイトル、サムネイル&の情報が消えて、別のビデオが表示されます。

は、ここ(200 OK)応答をgettinの私のAjaxコード

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);    
    } 
}); 
} 

要求が働いている、イムです。新しいビデオ用のHTMLコードブロックが返されます。

問題は、アイコンをクリックすると、div内のすべてのHTMLが消えています。私は空のタグを持っているので、私はそれが "空"と解釈されると思う。しかし、私の火かき棒.Netタブでは、私は応答があることをはっきりと見ることができます。

お願いします。既に修正、THANKS

* * EDIT **

は今$(この)と親()で特定のdivを対象とする問題を抱えてイム。助けてもらえますか?

私はこれを試みたが、その作業はないの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> 
    ... 

をターゲットにしたいです。

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 

何が間違っているのですか?

答えて

3

問題は、「完全な」コールバック関数を使用していることです。これは間違っている可能性がありますが、そのコールバックは成功または失敗の後に呼び出されることを意味します。それはクリーンアップのためのより多くのもので、期待どおりの応答データを受信しません。基本的には、「完了」から「成功」に変更するだけで、期待通りの結果が得られます。

しかし、私は個人的にAjax関数を使用することを推奨していません。なぜなら、それは完全に必要なように見えるからです。 Ajax関数は主に複雑なトランザクションのために存在し、あなたはかなり単純なもののようです。唯一、データのパラメータを取得しません

$.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"); 
+0

ありがとうございます!成功/完了の反応が違っていたことは分かっていませんでした。 – Lelly

+0

私は別の問題を抱えています。 – Lelly

1

変更

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);    
    } 
}); 
} 

成功とは異なりcompleteコールバックcomplete to successから:私は何を提案し、jQueryのは、提供さそうのような「ショートカット」機能を使用していますjqXHRパラメータ。

関連する問題