我的html主体中有5个图像,当用户点击其中一个时,jquery更改了点击图像的样式和未单击图像的样式
例如用户通过img_choose1点击图片,img_choose1边框将变为蓝色,但问题在于其他图片边框不会变为红色 怎么办?
for (var i=1; i <= 5; i++) {
$(body).append('<img id="img_choose'+i+'" height="100" src="a'+i+'.jpg"/>');
}
$("[id^='img_choose']").click(function() {
$(this).css("border","rgba(70,70,180,0.5) medium solid");
//$(this).siblings().css("border","rgba(160,20,70,0.5) medium solid");
// It don't change other selected elements border color
})
答案 0 :(得分:1)
试试 DEMO
for (i=1; i <= 5; i++) {
$('body').append('<img id="img_choose'+i+'" src="http://placehold.it/350x150" alt="">');
}
$('img').click(function() {
$(this).css('border', '1px solid blue');
$(this).siblings().css('border', '1px solid red');
});