Question

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

小提琴example

例如a has：

$('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();
});

你怎么办？

Answer 1

调用这样的函数的问题是你在this函数中丢失了showTables的上下文。你有两个选择。首先，您可以将其作为参数传递：

$('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);

后者在可能的情况下是优选的，因为它的＆＃39;简洁。

Answer 2

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

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

点击活动制作自定义功能

2 个答案: