Question

I m trying to change the border color of an image using its id with jquery ( photo[ id ] is passed in from a previous function ) the ids of the photos are of the form photo239839

 $( #photo +photo[ id ]+  ).click(function(){  
       $( #photo +photo[ id ]+  ).css( border-color , #777 );

    });

When I try to use this same code using its class it works, but I can t use this method since there are multiple images on the same page with the same class

$( img.flickr_photo ).click(function() {
    $("this.flickr_photo").css( border-color , #777 );
});

Answer 1

这是你需要做的事情：

$( img.flickr_photo ).click(function(){  
       $(this).css( border-color , #777 );
});

Answer 2

I would always always add a css class rather than an inline style. Much more maintainable and extensible.

例子:

$( img.flickr_photo ).click(function(){  
       $(this).addClass( greyishBorder );
});

Answer 3

任何一张照片[ id ] 要么是错误的，要么是在您设置点击处理程序后发生了更改。

为了测试第一个情况，您可以警报（或使用FireBug的console.log等）jQuery选择的长度：

alert($( #photo +photo[ id ]).length);

第二种情况的解决办法是使用 "this"。在点击处理程序中， "this" 被设置为引起点击事件的元素。

$( #photo +photo[ id ]).click(function(){  
   $(this).css( border-color , #777 );
});

编辑： @Dreas Grech 是正确的，只要您想将该行为应用于具有flickr_photo类的所有元素。如果您可以将选择器概括为使用单个查询选择所有元素，那么最好这样做。

友情链接