在try catch块中包装骨干视图事件处理程序或jQuery事件处理程序

时间:2014-02-28 06:12:16

标签: javascript backbone.js error-handling extend backbone-views

我想要报告JavaScript错误的全局事件处理。我们在生产中缩小了JS文件,所以我试图在sourcemap的帮助下完成它。

  

不幸的是,未被捕获的错误(由浏览器的顶层报告   错误处理程序,window.onerror)当前不包含列号   在任何当前浏览器中。 HTML5规范已更新为要求   这个,所以这可能会在不久的将来改变。
  资料来源:https://rollbar.com/docs/guides_sourcemaps/

所以现在我需要在try catch块中包装骨干视图事件。应该有扩展Backbone.View的通用方法。可能在delegateEvents函数的某处。

1 个答案:

答案 0 :(得分:0)

这是我最终如何在try-catch块中包装所有jQuery事件处理程序。

// maintain a reference to the existing function
var oldOn = $.fn.on;
// ...before overwriting the jQuery extension point
$.fn.on = function(types, selector, data, fn, /*INTERNAL*/ one) {
  // parameter correction for backward compatibility copied from `on` function of jQuery JavaScript Library v1.9.0

  // Types can be a map of types/handlers
  if (typeof types === "object") {
    // ( types-Object, selector, data )
    if (typeof selector !== "string") {
      // ( types-Object, data )
      data = data || selector;
      selector = undefined;
    }
    for (type in types) {
      this.on(type, selector, data, types[type], one);
    }
    return this;
  }

  if (data == null && fn == null) {
    // ( types, fn )
    fn = selector;
    data = selector = undefined;
  } else if (fn == null) {
    if (typeof selector === "string") {
      // ( types, selector, fn )
      fn = data;
      data = undefined;
    } else {
      // ( types, data, fn )
      fn = data;
      data = selector;
      selector = undefined;
    }
  }
  if (fn === false) {
    fn = returnFalse;
  } else if (!fn) {
    return this;
  }
  // ENDS - parameter correction for backward compatibility copied from `on` function of jQuery JavaScript Library v1.9.0

  if (fn) {
    var origFn = fn;
    var wrappedFn = function() {
      try {
        origFn.apply(this, arguments);
      } catch (e) {
        //handle the error here.
      }
    };
    fn = wrappedFn;
  }
  return oldOn.apply(this, [types, selector, data, fn, /*INTERNAL*/ one]);
};


<强>更新

有一个错误,jQuery-UI droppable divs坚持像胶水这样的鼠标指针;)而不是被删除,它被追溯到这段代码作为罪魁祸首。

因此,请确保使用条件if(!(arguments.length === 4 && arguments[1] === null)) {}

包装此扩展程序

喜欢这个。

// maintain a reference to the existing function
var oldOn = $.fn.on;
// ...before overwriting the jQuery extension point
$.fn.on = function(types, selector, data, fn, /*INTERNAL*/ one) {

    // We can ignore .bind() calls - they are passed from jquery-ui or other outdated components
    if(!(arguments.length === 4 && arguments[1] === null)) {
       //rest of the above code here.
    }
}