Jquery 通过单击事件创建自定义函数

问候,， 我需要为下一个事件创建一个自定义函数，我将来需要在其他类似情况下使用

小提琴

例如，我们有：

$('a.trigger').on('click', function (e) {
    e.preventDefault();
    var dataTrigger = $(this).attr('data-trigger');
        $(this).find('i').toggleClass( 'fa-plus-square fa-minus-square'); //Cambia el icono

    if ($('div[data-container="' + dataTrigger + '" ]').length) {
        var elem = $('[data-container="' + dataTrigger +'"]');
        elem.toggle();
    }
});

将单击事件转换为：

var showTables = function (){
    e.preventDefault();
    var dataTrigger = $(this).attr('data-trigger');
    $(this).find('i').toggleClass( 'fa-plus-square fa-minus-square'); //Cambia el icono

    if ($('div[data-container="' + dataTrigger + '" ]').length) {
        var elem = $('[data-container="' + dataTrigger +'"]');
        elem.toggle();
    }
}

我需要这样的电话：

$('a.trigger').on('click', function (e) {
   showTables();
});

---

如何操作？

只需在单击中引用现有功能，而不是创建新功能：

$('a.trigger').on('click', showTables);

---

像这样调用函数的问题是，在

showTables

函数中，会丢失

this

的上下文。你有两个选择。首先，您可以将其作为参数传递：

$('a.trigger').on('click', function (e) {
    e.preventDefault();
    showTables(this);
});

var showTables = function (that) {
    // your code, changing references of 'this' to 'that'
}

或者，您可以将

showTables

保持原样，并将函数引用提供给处理程序以维护范围：

$('a.trigger').on('click', showTables);

---

后者因其“简洁性”而在可能的情况下更可取。

非常感谢，它与您建议的第一个选项配合使用。第二，我不知道如何使用它，因为浏览器返回给（这个）值的未定义值。