Javascript 使用不同的父选择器jQuery重构相同的函数

我使用的两个函数做相同的事情，但有不同的父选择器。不确定如何将它们组合成一个函数

---

可能不是最具扩展性的选项，但下面是一个简单快捷的方法

$(".entity-selectable").click(onClick);
$(".periodicity-selectable").click(onClick);

function onClick() {
        var className = '';
        if ($(this).hasClass('entity-selectable')) {
            className = 'entity-selectable';
        } else if ($(this).hasClass('periodicity-selectable')) {
            className = 'periodicity-selectable';
        }
        if(!$(this).hasClass('selected-item')) {
            $('.'+ className).removeClass('selected-item');
        } 
        $(this).toggleClass('selected-item');

        if ($(this).hasClass("selected-item") && $("." + className).hasClass("selected-item")) {    
           $("#hidden-content").addClass("fadeInUp");
        }
    }

---

可能不是最具扩展性的选项，但下面是一个简单快捷的方法

$(".entity-selectable").click(onClick);
$(".periodicity-selectable").click(onClick);

function onClick() {
        var className = '';
        if ($(this).hasClass('entity-selectable')) {
            className = 'entity-selectable';
        } else if ($(this).hasClass('periodicity-selectable')) {
            className = 'periodicity-selectable';
        }
        if(!$(this).hasClass('selected-item')) {
            $('.'+ className).removeClass('selected-item');
        } 
        $(this).toggleClass('selected-item');

        if ($(this).hasClass("selected-item") && $("." + className).hasClass("selected-item")) {    
           $("#hidden-content").addClass("fadeInUp");
        }
    }

---

您只需创建一个组合函数，并通过单击每个类的事件处理程序传递它

this

。在新函数中，只需从当前元素的同级中删除类。大概是这样的：

(function($) {
    "use strict";
    function combinedFunction(element){
        if(!$(element).hasClass('selected-item')) {
            $(element).siblings().removeClass('selected-item');
        } 
        $(element).toggleClass('selected-item');

        if ($(".entity-selectable").hasClass("selected-item") && $(".periodicity-selectable").hasClass("selected-item")) {

           $("#hidden-content").addClass("fadeInUp");
        }

    }
    /*---SELECTED ITEM---*/
    $(".entity-selectable").click(function() {
          combinedFunction(this);
    });

    /*---SELECTED ITEM---*/
    $(".periodicity-selectable").click(function() {
          combinedFunction(this);
    });

})(jQuery);

---

您只需创建一个组合函数，并通过单击每个类的事件处理程序传递它

this

。在新函数中，只需从当前元素的同级中删除类。大概是这样的：

(function($) {
    "use strict";
    function combinedFunction(element){
        if(!$(element).hasClass('selected-item')) {
            $(element).siblings().removeClass('selected-item');
        } 
        $(element).toggleClass('selected-item');

        if ($(".entity-selectable").hasClass("selected-item") && $(".periodicity-selectable").hasClass("selected-item")) {

           $("#hidden-content").addClass("fadeInUp");
        }

    }
    /*---SELECTED ITEM---*/
    $(".entity-selectable").click(function() {
          combinedFunction(this);
    });

    /*---SELECTED ITEM---*/
    $(".periodicity-selectable").click(function() {
          combinedFunction(this);
    });

})(jQuery);

---

这很有效。我喜欢调用同一个函数，从不同的父（类）解析“this”。我希望用户不能删除选定的项目，一旦每个家长被选中，而改变选择是确定的。我稍微调整了一下。对第一个“如果”有什么想法吗？逃离函数的更好方法？这很有效。我喜欢调用同一个函数，从不同的父（类）解析“this”。我希望用户不能删除选定的项目，一旦每个家长被选中，而改变选择是确定的。我稍微调整了一下。对第一个“如果”有什么想法吗？逃离函数的更好方法？这是可行的，但我认为类名为'EntitySelective'的小错误；我编辑了它。如果你对答案感到满意，你可以把它标记为正确的吗？这是可行的，但我认为有一个小的输入错误，className='entityselective'；我编辑了它。如果你对答案满意，你能把它标对吗。