Question

我尝试了这段代码，但没有任何机会让它运行起来。我希望我能点击图像上的活动课程。

这是我的HTML

<ul id="og-grid">
    <li>
        <a href="#"><img src="http://hhhhold.com/150"></img></a>
    </li>

    <li>
        <a href="#"><img src="http://hhhhold.com/149"></img></a>
    </li>

    <li>
        <a href="#"><img src="http://hhhhold.com/151"></img></a>
    </li>
</ul>

这里是jQuery

$(document).ready(function() {
    $('#og-grid li a').click(function (e) {
        e.preventDefault();
        $(this).closest('img').addClass('active').siblings().removeClass('active');

    });

});
});//]]>

以前是否有人这样做过，所以能帮助我吗？

JSFIDDLE

Answer 1

试试这个

JSFiddle

$(document).ready(function() {
    $('#og-grid li a').click(function (e) {
        e.preventDefault();
        $('#og-grid li a img').removeClass('active');
        $(this).find('img').addClass('active');
    });
});

Answer 2

我分两步完成：

// clear active classes from all images
$('#og-grid li a img').removeClass('active');
// add active class to clicked image
$(this).find('img').addClass('active');

Fiddle.

Answer 3

最近只有DOM没有下降。使用儿童。另外，img没有兄弟姐妹，它是有兄弟姐妹的li元素。因此，您需要重新启动DOM来修复它们。

我会删除所有类，然后添加你需要的类。

添加和删除类onclick

3 个答案:

添加和删​​除类onclick

3 个答案:

添加和删除类onclick