Question

技术

我正在使用jQuery 1.9.1和twitter bootstrap 2.3.1

上下文

我目前正面临Twitter bootstrap typeahead插件中的一个错误，该错误阻止您进入＆＃34;＆amp;＆＃34;当自动完成下拉列表打开时，输入中的字符[type =＆＃34; text＆＃34;]（＆符号返回键码38，向上箭头是键码38）。

我希望能够查看附加到输入的所有事件[type =＆＃34; text＆＃34;]并找出导致问题的原因。 < / p>

问题

// bootstrap typeahead plugin
// bootstrap.js:2126
this.$element
  .on('focus',    $.proxy(this.focus, this))
  .on('blur',     $.proxy(this.blur, this))
  .on('keypress', $.proxy(this.keypress, this))
  .on('keyup',    $.proxy(this.keyup, this))

// bootstrap.js:2171
move: function (e) {
  if (!this.shown) return

  switch(e.keyCode) {
    case 9: // tab
    case 13: // enter
    case 27: // escape
      e.preventDefault()
      break

    case 38: // up arrow
      e.preventDefault()
      this.prev()
      break

    case 40: // down arrow
      e.preventDefault()
      this.next()
      break
  }

  e.stopPropagation()
}

代理方法返回一个具有给定上下文的新函数，因此很难调试。

我在Chrome中找到了什么 - 根本没有帮助我

// Get event listeners on element
getEventListeners($('[name="searchTerm"]')[0])

// Get the keydown event to see what's going on
getEventListeners($('[name="searchTerm"]')[0]).keydown[0].listener

// Returns
function (a){return typeof f!="undefined"&&(!a||f.event.triggered!==a.type)?f.event.dispatch.apply(i.elem,arguments):b}

// <function scope> points back to the function above
// ['<function scope>'] is an example
getEventListeners($('[name="searchTerm"]')[0]).keydown[0].listener['<function scope>']

我在jQuery中发现了什么 - 帮助我笨拙？

// Get event listeners on element
// $element.data('events') is no longer supported. version >= 1.8
$._data($('[name="searchTerm"]')[0], 'events')

// Get the keydown event to see what's going on
$._data($('input.search-query.span2')[0], 'events').keydown[0].handler

// Returns
function (){return a.apply(c,f.concat(F.call(arguments)))}

// <function scope> points to the correct function
// ['<function scope>']['Closure']['a'] is an example
$._data($('input.search-query.span2')[0], 'events').keydown[0].handler['<function scope>']['Closure']['a']

// Returns
function (e) { this.suppressKeyPressRepeat = ~$.inArray(e.keyCode, [40,38,9,13,27]) this.move(e) }

问题

无论如何都要获得＆lt; function scope＆gt;和＆lt; closure＆gt; javascript函数的上下文？
有没有更简单的方法来调试使用jQuery在DOM元素上触发$ .proxy事件侦听器？
有没有更好的方法来调试这些事件？

谢谢！

Answer 1

您可以尝试显示jQuery事件处理程序的jQuery Debugger Chrome extension。 Firefox Nightly有一个similar feature。

如何调试jQuery $ .proxy事件监听器？

1 个答案: