如何重构 2 个相同的函数？

Question

我正在用我薄弱的 javascript 知识开发一个可访问的轮播，但我遇到了语法问题。

这是给我带来问题的部分：

events: function () {
    var self = this;
this.target.on('click', '.nav-right, .right', function (e) {
    e.preventDefault();
    self.moveCarousel(self.target.find('.carousel-wrapper li'), 'left', 'right', function (cur, $el) {
        if (cur === $el.length - 1) {
            return '0';
        }

        return cur + 1;
    });
});

this.target.on('focus', '.nav-right, .right', function (e) {
    e.preventDefault();
    self.moveCarousel(self.target.find('.carousel-wrapper li'), 'left', 'right', function (cur, $el) {
        if (cur === $el.length - 1) {
            return '0';
        }

        return cur + 1;
    });
});

如果重要的话，这里是完整的代码（121 行）：http://jsfiddle.net/12b63z7e/

现在，该函数的用途是什么？我只是希望幻灯片事件在单击和聚焦时都触发。问题是，根据我的编写方式，基本上是复制粘贴焦点功能的点击功能，JS 不再触发第一个功能（我现在无法在点击时滑动）。所以我想我需要在一个函数中重写这两个函数，该函数将在焦点和单击时滑动项目。

有什么不明白的地方请问我

Answer 1

您可以将 space 分隔的事件名称列表传递给 on() 以将相同的处理程序注册到相同元素上的多个事件

events: function () {
    var self = this;
    this.target.on('click focus', '.nav-right, .right', function (e) {
        e.preventDefault();
        self.moveCarousel(self.target.find('.carousel-wrapper li'), 'left', 'right', function (cur, $el) {
            if (cur === $el.length - 1) {
                return '0';
            }

            return cur + 1;
        });
    });

如何重构 2 个相同的函数？

How to re-factor 2 functions which are the same?

html

javascript

css

jquery

accessibility