2010-10-12 66 views
1

我已經得到了這個腳本工作正常,允許用戶投票,但我是如何使投票按鈕的東西,當再次點擊它切換回正常圖像!就像計算器:jquery使用jQuery切換事件切換投票?

這是我的腳本:

$(document).ready(function() { 
    $('.statuses').delegate('.vote_up', 'click', function(e) { 

     //stop event 
     e.preventDefault(); 
     //get the id 
     var the_id = $(this).closest('.message').attr('id').split('_').pop(); 
     //the main ajax request 
     $.ajax({ 
      context: this, 
      type: "POST", 
       // Make sure "this" in the callback refers to the element clicked 

      data: "action=vote_up&id=" + the_id, 
      url: "ajax/votes.php", 
      success: function (msg) { 

       $(this).siblings("span.vote_count").html(msg).fadeIn(); 
        // get the child <img> and set its src 
       $(this).children("img").attr("src", "img/uparrowActive.png"); 
      } 
     }); 
    }); 

HTML:

<ul class="statuses"> 
<li id="set_41" class="message"> 
<span class="vote_count">0</span> 
<a href="#" class="vote_up"><img src="img/uparrow.png" /></a> 

這是我希望發生僞語言:

a user clicks vote image, it changes the image(uparrowActive) 
//I've done that already 
then 
if user clicks the same image again it goes back to normal image(uparrow) 
+0

瞭解CSS sprites。 – BalusC 2010-10-12 18:34:57

+0

你好我在完成我的應用程序後要這樣做,但我試圖先把所有東西放在一起! – getaway 2010-10-12 18:36:48

回答

0

jquery has a toggle event允許您將兩個事件處理程序綁定到交替調用的元素。

*未經測試,可能具有簡單的語法錯誤。

myElement.toggle(vote(), unvote()); 

function vote() 
{ 
    // add a vote to the item 
    // change icon to vote icon 
} 

function unvote() 
{ 
    // remove a vote from the item 
    // change icon to default icon. 
} 
+0

所以,如果不是我使用點擊,我使用切換? ;) – getaway 2010-10-12 18:38:54

+0

並記住我需要更改ajax請求的投票,所以我不要做什麼! – getaway 2010-10-12 18:39:54

+0

我還是不明白,即時通訊JavaScript和jQuery的新的Bie – getaway 2010-10-12 19:10:43