2010-10-08 112 views
1

我想讓jQuery來計算一個ID被點擊的次數。 例如,如果#kwick_1被點擊一次,我希望它加載視頻'其他'什麼也不做。jQuery綁定解除綁定點擊事件

我期待在應用此整個功能,因此同樣適用於2,3,4等

我將如何實現這一目標?

var timesClicked = 0; 
    $('#kwick_1, #kwick_2, #kwick_3, #kwick_4, #kwick_5, #kwick_6, #kwick_7').bind('click', function(event){ 
    var video = $(this).find('a').attr('href'); /* bunny.mp4 */ 

    var clickedID = $(this).attr('id'); /* kwick_1 */ 
    var vid = 'vid'; 
    timesClicked++; 

    $(this).removeAttr('id').removeAttr('class').attr('id',clickedID + vid).attr('class',clickedID + vid); 
    if(timesClicked == 1) { 

    $.get("video.php", { video: video, poster: 'bunny.jpg', }, function(data){ 
    $('.'+clickedID+vid).html(data); 
    }); 

    } else { 
    /* Do nothing for now */ 
    } 
    return false; 
    }); 

回答

4

您可以使用.one()做到這一點更容易一點,像這樣:

$('#kwick_1, #kwick_2, #kwick_3, #kwick_4, #kwick_5, #kwick_6, #kwick_7').one('click', function(event){ 
    var video = $(this).find('a').attr('href'), clicked = this.id + 'vid'; 

    $(this).attr({ id: clicked, 'class': clicked }); 
    $.get("video.php", { video: video, poster: 'bunny.jpg', }, function(data){ 
    $('.'+clicked).html(data); 
    }); 
}).click(function() { return false; }); 

剩下的只是優化和削減重複的代碼,但這個想法是對的一部分,你只能綁定想要使用.one()發生一次,那麼該處理程序將在第一次執行後自行移除。然後我們使用.click()綁定return false,因爲那個應該總是發生。請確保之後的與上面的例子一樣,因爲事件處理程序按照它們綁定的順序運行。

如果你可以給他們所有的班級,你也可以用替代你的#kwick_1, #kwick_2....選擇器,上面的這個選項仍然可以工作,而且更容易維護。