我正在尝试jQuery来计算ID被点击的次数。 例如,如果#kwick_1被点击一次,我希望它加载视频'else'什么都不做。
我正在考虑在整个功能中应用这个,所以同样适用于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;
});
答案 0 :(得分: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....
选择器替换为.kwick
,那么您可以将它们替换为{{1}}选择器,上面的内容仍然可以使用并且更容易维护。