jquery - 为什么我的 jQuery toggleClass 不工作？

Question

我几乎是 jQuery 的新手，我无法在单击时将图像放大到其大小的 100%。我已经多次查看了一小段代码，它似乎应该是这样的。这是 jQuery:

$(document).ready(function() {
    $('img.gallery').click(function() {
        $(this).toggleClass('enlarge');
    });
});

CSS:

    img.gallery {
        border: 1px solid #aaaaaa;
        width: 260px;
        height: 260px;
    }

    .enlarge {
        width: auto;
    }

我是否正确链接到库和脚本？

    <link rel="stylesheet" type="text/css" href="style.css">
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
    <script type="text/javascript" src="script.js"></script>
    <script type="text/javascript" src="gallery.js"></script>

没有上面代码片段的完整 CSS 在这里:http://ruzzio.net/style.css

我想知道 CSS 中是否有什么东西阻止了图像在点击时放大(假设我的 jQuery 是准确的)。

提前感谢大家的帮助。这是我第一次使用这个网站，如果我忘记了一些重要信息，我深表歉意。

Answer 1

img.gallery 比 .enlarge 具有更高的特异性(0011 与 0010)，因此它会被认为更重要。

尝试删除 img 标签名称。 CSS 选择器应尽可能简单。