未为emulateTransitionEnd触发事件

时间:2018-10-29 09:18:53

标签: javascript bootstrap-4

当我以太高的TRANSITION_DURATION运行以下代码时,该函数将永远不会执行。

_el.height(_el[0].scrollHeight)
 .one(Util.TRANSITION_END, complete)
 .emulateTransitionEnd(TRANSITION_DURATION);

例如,当TRANSITION_DURATION设置为350时,永远不会调用该事件。但是,当TRANSITION_DURATION设置为1时,事件就会发生。

努力理解其原因?有人更了解吗?

有关代码的上下文,请参见下文,具体问题与_show函数末尾的行有关:

MetisMenu.prototype._show = function _show(element) {
  if (this._transitioning || $(element).hasClass(this._config.collapsingClass)) {
    return;
  }
  var _this = this;
  var _el = $(element);

  var startEvent = $.Event(Event.SHOW);
  _el.trigger(startEvent);

  if (startEvent.isDefaultPrevented()) {
    return;
  }

  _el.parent(this._config.parentTrigger).addClass(this._config.activeClass);

  if (this._config.toggle) {
    this._hide(_el.parent(this._config.parentTrigger).siblings().children(this._config.subMenu + '.' + this._config.collapseInClass).attr('aria-expanded', false));
  }

  _el.removeClass(this._config.collapseClass).addClass(this._config.collapsingClass).height(0);

  this.setTransitioning(true);

  var complete = function complete() {
    console.log("running complete")
    _el.removeClass(_this._config.collapsingClass).addClass(_this._config.collapseClass + ' ' + _this._config.collapseInClass).height('').attr('aria-expanded', true);

    _this.setTransitioning(false);

    _el.trigger(Event.SHOWN);
  };

  if (!Util.supportsTransitionEnd()) {
    complete();
    return;
  }
  _el.height(_el[0].scrollHeight).one(Util.TRANSITION_END, complete).emulateTransitionEnd(TRANSITION_DURATION);
};

0 个答案:

没有答案