javascript - 如何为两个类添加相同的功能？

有一个jQuery代码已经按照我的要求工作了。.foto类执行函数。但是我应该添加.fotoleft类来完成相同的功能。如何为两个不同的类执行相同的函数？

$(document).ready(function() {
    $(".foto").click(function() {

        $src = $(this).attr("src");
        if (!$("#light-box").length > 0) {
            $("body").append("<div id='light-box'> <span class='close'></span><img src=''></div>");
            $("#light-box").slideDown();
            $("#light-box img").attr("src", $src);
        } else {
            $("#light-box").slideDown();
            $("#light-box img").attr("src", $src);
        }
    });

    $("body").on("click", "#light-box", function() {
        $("#light-box").slideUp();
    });
});

最佳答案

如果您希望.fotoleft执行与.foto相同的功能，我发现最有效的方法是在html中使用.foto两次，而不是在JS中使用两次。
我更喜欢这种方法，因为这样可以更容易地将函数应用于多个或附加元素，而无需向JS添加更多类。
即

<a class='foto'>Do Something</a>

<a class='foto fotoleft'>Do Something too></a>

您可以选择修改您的css以使.foto更兼容，这样您就不会覆盖任何样式。

关于javascript - 如何为两个类添加相同的功能？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/39698831/