jquery 和 javascript 在类之间切换图像标签答案

【问题标题】：jquery and javascript toggle image tags between classesjquery 和 javascript 在类之间切换图像标签
【发布时间】：2014-06-27 20:58:33
【问题描述】：

我似乎无法做到这一点。请帮忙。该代码应该在用户单击 div 时切换 img 标签的类。

这里是 HTML

        <li><img src="IMG/Gallery/val_day.jpg" id="img27" style="width: 100%;" alt="val_day" /></li>
            </ul>


        </div>
            <p id="previousLink" href="#">«</p>
        <p id="nextLink" href="#">»</p>
        </div>

这是我的 jQuery 和 Javascript。

$(document).ready(function () {
var Gallery = {
    li: [''],
    picNum: 0,
    nextPic: function () {
        $('#nextLink').click(function () {
            var $activeImg = "'#img" + Gallery.picNum + "'";
            $($activeImg).toggleClass('activePic');
            Gallery.picNum++;
            $activeImg = "'#img" + Gallery.picNum + "'";
            $($activeImg).toggleClass('activePic');

        });
    }
}

});

【问题讨论】：

没有足够的信息，我看到的第一个问题是您的 jQuery 选择器如何查找图像。删除撇号。例如，将var $activeImg = "'#img" + Gallery.picNum + "'"; 更改为var $activeImg = "#img" + Gallery.picNum.toString();

标签： javascript jquery html class toggleclass

【解决方案1】：

我看到的问题是 jQuery 选择器如何寻找图像。

去掉撇号。例如，将var $activeImg = "'#img" + Gallery.picNum + "'"; 更改为：

var $activeImg = "#img" + Gallery.picNum.toString();

第二个 $activeImg 也应该做同样的事情。

我的另一条评论是关于惯例的。按照惯例，根据我的经验，代表 jQuery 对象的变量应该以 $ 为前缀。 $activeImg 似乎不是 jQuery 对象。这是一个字符串。请改用activeImageSelector（建议）。

更新的 JS

$(document).ready(function () {
    var Gallery = {
        li: [''],
        picNum: 0,
        nextPic: function () {
            $('#nextLink').click(function () {
                var activeImageSelector  = "#img" + Gallery.picNum.toString();
                $(activeImageSelector ).toggleClass('activePic');
                Gallery.picNum++;
                activeImageSelector  = "#img" + Gallery.picNum.toString();
                $(activeImageSelector ).toggleClass('activePic');

            });
        }
    }
});

【讨论】：