我如何拦截所有图片的点击?我有一堆图像，每个需要回复点击

how can I intercept a click for all img's ? I have a bunch of images, each needs to reply to a click.

本文关键字：一堆 图像 回复 何拦截 有图片      更新时间：2023-09-26

我想向我的用户展示图像，在那里他们可以选择它们。我需要他们选择一个有限的数字，比如5个，所以:图像显示在一个矩阵中，用户可以点击它们。我想:

function boom()
{
this.css('background-color','#fff');
this.data('clicked','yes'); 
// I should also make checks here to see how many were clicked already
}
$('img').click(boom);

//我认为这将连接所有的img点击到这个函数，其中我可以调用'this'与css函数…

但是它不像我想象的那样工作…

$(function(){
    var clicked_img = 0;
    $('img').click(function(){
        $(this).css('background-color','#fff').data('clicked','yes');
        clicked_img++;
    });
});

编辑:为新请求更新了下面的代码，在注释线程中找到:

根据你更新的代码请求，如果你的HTML是:

<img id="one" class="clicked" src="img/one.png" /> 
<img id="two" class="clicked" src="img/two.png" />

这个JQuery已经修复为您工作:

$('img.clicked').click(function(){
   boom(this);
});
function boom(e) {    
    if($(e).data('clicked')=='yes') {
        $(e).data('clicked','no').css('border','none');
    } 
    else { 
        $(e).data('clicked','yes').css('border','3px solid #cccccc');
    } 
}

新代码的工作演示:http://jsfiddle.net/Vwye8/

尝试将变量赋值给匿名函数

var boom = function()
{
this.css('background-color','#fff');
this.data('clicked','yes'); 
// I should also make checks here to see how many were clicked already
}

，然后调用$('img').live("click",boom);Js fiddle here: http://jsfiddle.net/t7u6t/

相关文章：