SOURCE

Question

在我的Javascript中与IE8不兼容，我不知道如何解决它。我收到错误＆＃34; currentTarget为null或不是对象，＆＃34;这段代码中出现了这个：

(function() {
  var basicTemplate, _timer, _url;
  _timer = null;
  _url = "/search";
  $(document).ready(function() {
    var search, searchCallback, searchFailure;
    $('[data-does=typeahead-rep-search]').on('keyup', function(e) {
      clearTimeout(_timer);
      return _timer = setTimeout(search, 300, e);
    });
    search = function(e) {
      var $query, division, request, target, _data;
      $query = $(e.currentTarget);
      _data = {};
      if (_data.q.length > 2) {
        return request = $.ajax(_url, {
          data: _data,
          success: searchCallback,
          error: searchFailure
        });
      } else {
        return $('#search-results').html("");
      }
    };
    searchCallback = function(data, status, jqXhr) {
      return $('#search-results').html(basicTemplate(data));
    };
    return searchFailure = function(jqXhr, status, errorThrown) {
      console.log('an error has occurred while attempting to search');
      return $('#search-results').html("");
    };
  });

}).call(this);

是否有人知道如何重新编码此代码段以使其在IE中正常运行？

谢谢！

Answer 1

我发现了这个问题。问题是这一行：

setTimeout(search, 300, e);

最容易解决的问题是：

setTimeout((function(e) { return function() { search(e) }; })(e), 300);

我把它包裹在一个封闭处，以避免确定范围。

来自setTimeout的文档：

请注意，在第一种语法中将其他参数传递给函数在Internet Explorer＆lt; 9.如果要在该浏览器上启用此功能，则必须使用兼容性代码（请参阅回调参数段落）。

我只是想从文档中复制这些全文，作为参考。

如果需要将参数传递给回调函数，但需要它在Internet Explorer中工作，它不支持发送附加内容你可以参数（既不用setTimeout（）也不用setInterval（））包括这个特定于IE的兼容性代码，它将启用该浏览器中的HTML5标准参数通道功能两个计时器只需将它插入脚本的开头即可。

/*\
|*|
|*|  IE-specific polyfill which enables the passage of arbitrary arguments to the
|*|  callback functions of JavaScript timers (HTML5 standard syntax).
|*|
|*|  https://developer.mozilla.org/en-US/docs/DOM/window.setInterval
|*|
|*|  Syntax:
|*|  var timeoutID = window.setTimeout(func, delay, [param1, param2, ...]);
|*|  var timeoutID = window.setTimeout(code, delay);
|*|  var intervalID = window.setInterval(func, delay[, param1, param2, ...]);
|*|  var intervalID = window.setInterval(code, delay);
|*|
\*/

if (document.all && !window.setTimeout.isPolyfill) {
  var __nativeST__ = window.setTimeout;
  window.setTimeout = function (vCallback, nDelay /*, argumentToPass1, argumentToPass2, etc. */) {
    var aArgs = Array.prototype.slice.call(arguments, 2);
    return __nativeST__(vCallback instanceof Function ? function () {
      vCallback.apply(null, aArgs);
    } : vCallback, nDelay);
  };
  window.setTimeout.isPolyfill = true;
}

if (document.all && !window.setInterval.isPolyfill) {
  var __nativeSI__ = window.setInterval;
  window.setInterval = function (vCallback, nDelay /*, argumentToPass1, argumentToPass2, etc. */) {
    var aArgs = Array.prototype.slice.call(arguments, 2);
    return __nativeSI__(vCallback instanceof Function ? function () {
      vCallback.apply(null, aArgs);
    } : vCallback, nDelay);
  };
  window.setInterval.isPolyfill = true;
}

IE Only Fix

如果你想要一个完全不显眼的黑客为其他所有移动或桌面浏览器，包括IE 9及以上版本，你可以使用 JavaScript条件评论：

/*@cc_on
  // conditional IE < 9 only fix
  @if (@_jscript_version <= 6)
  (function(f){
     window.setTimeout =f(window.setTimeout);
     window.setInterval =f(window.setInterval);
  })(function(f){return function(c,t){var a=[].slice.call(arguments,2);return
    f(function(){c.apply(this,a)},t)}});
  @end
@*/

或者根据IE HTML条件采用非常干净的方法特征：

<!--[if lt IE 9]><script>
(function(f){
window.setTimeout =f(window.setTimeout);
window.setInterval =f(window.setInterval);
})(function(f){return function(c,t){
var a=[].slice.call(arguments,2);return f(function(){c.apply(this,a)},t)}
});
</script><![endif]-->

另一种可能性是使用匿名函数来调用你的回调，但这个解决方案有点贵。例如：

var intervalID = setTimeout(function() { myFunc("one", "two", "three"); }, 1000);

另一种可能性是使用函数绑定。例如：

setTimeout(function(arg1){}.bind(undefined, 10));

Answer 2

好吧，我通过修改代码解决了这个问题，如下所示。如果这不是解决此问题的推荐方法，请与我们联系。

SOURCE

search = function(e) {
      var $query, division, request, _data;
      var target = (e.currentTarget) ? e.currentTarget : e.srcElement;
      $query = $(target);
      _data = {};
      _data.q = $query.val();
      if (_data.q.length > 2) {
        return request = $.ajax(_url, {
          data: _data,
          success: searchCallback,
          error: searchFailure
        });
      } else {
        return $('#search-results').html("");
      }
    };

IE8 event.currentTarget为null或不是对象

2 个答案:

SOURCE