jquery - jquery在单击和向后更改图像

Question

我为这个简单的事情感到抱歉，但图像更改不适用于此。我尝试了很多选择，但也许我看不到问题所在。

 $('#accordion li.first').click(function() {
                    if ($(this).children('img').attr('src','img/drop.png')) {
                        $(this).children('img').attr('src','img/drop90.png');
                    }
                    if ($(this).children('img').attr('src','img/drop90.png')) {
                        $(this).children('img').attr('src','img/drop.png');
                    }
                 });

Answer 1

你可能想要

if ($(this).children('img').attr('src')=='img/drop.png') {

代替

if ($(this).children('img').attr('src','img/drop.png')) {

Answer 2

如果您想做不同的事情，请按照以下步骤操作：-

1. 为图像添加类drop&drop90
2. 在drop& drop90CSS 类上，应用 background-image: url(img/drop.png);和background-image: url(img/drop90.png);
3. 使用提到的 Jquery 和示例 CSS 使用函数切换两个类toggleClass()

查询：

$('#accordion li.first').click(function() {
    $(this).children('img').toggleClass("drop drop90");
});​

CSS：

.​drop​ {
    background-image: url(img/drop.png); 
    height: 100px; 
    width: 200px;
}
.drop90 {
    background-image: url(img/drop90.png); 
    height: 100px; 
    width: 200px;
}​

Answer 3

if ($(this).find('img').attr('src') === 'img/drop.png') 将始终评估为true .. 因为您将值分配给它而不是比较

试试这个

 $('#accordion li.first').click(function() {
       if ($(this).children('img').attr('src') === 'img/drop.png') {
          $(this).children('img').attr('src','img/drop90.png');
        }
        if ($(this).children('img').attr('src') === 'img/drop90.png') {
               $(this).children('img').attr('src','img/drop.png');
        }
 });

Answer 4

$('#accordion li.first').click(function() {
    var $this = $(this), $img = $this.children('img'), src = $img.attr('src');

    switch (src) {
        case 'img/drop.png':
            $img.attr('src', 'img/drop90.png');
        break;

        case 'img/drop90.png':
            $img.attr('src', 'img/drop.png');
        break;
    }
});