jquery嵌套绑定

我对jquery和javascript非常陌生。我正在看Splunk是如何实现它的一些模块的，并且感到困惑

这是一个示例代码，其中遗漏了很多内容

this.input.bind("focus",this.onInputFocus.bind(this))

this.input指用于搜索栏的文本框。稍后，在文件中声明onInputFocus

onInputFocus: function(evt) {
   ...
   ...
   return true
},

我知道“this.input.bind”语句告诉浏览器在有人单击文本框时执行onInputFocus，但我不理解eventhandler末尾的.bind（this）。请向我解释这个符号，以便我理解发生了什么。

外部”使用jQuery将事件处理程序绑定到

焦点

事件

“内部”

函数.bind

正在创建一个绑定到特定上下文的函数（当调用函数时，使

此

等于该上下文）。这不需要框架（但需要现代浏览器）

因此，在本例中，调用

函数.bind

确保每次聚焦

输入

，都将

onInputFocus

方法的上下文设置为

this

的当前值（这可能是您正在使用的小部件/组件）。这是必要的，因为它通常是发生事件的元素

对此有很好的解释

---

为了更好地说明其工作原理，请举一个简单的示例：

HTML:

​<button id="test" type="button">Test</button>
<button id="test2" type="button">Test 2</button>
<div id="target"></div>

在第一个事件绑定中，调用

fill

，并将

this

设置为

#test

（因为这是单击的元素）

在第二种情况下，再次调用

fill

，但由于在事件绑定中调用了

函数.bind

，因此将

this

设置为

#target

示例：

外部”使用jQuery将事件处理程序绑定到

焦点

事件

“内部”

函数.bind

正在创建一个绑定到特定上下文的函数（当调用函数时，使

此

等于该上下文）。这不需要框架（但需要现代浏览器）

因此，在本例中，调用

函数.bind

确保每次聚焦

输入

，都将

onInputFocus

方法的上下文设置为

this

的当前值（这可能是您正在使用的小部件/组件）。这是必要的，因为它通常是发生事件的元素

对此有很好的解释

---

为了更好地说明其工作原理，请举一个简单的示例：

HTML:

​<button id="test" type="button">Test</button>
<button id="test2" type="button">Test 2</button>
<div id="target"></div>

在第一个事件绑定中，调用

fill

，并将

this

设置为

#test

（因为这是单击的元素）

在第二种情况下，再次调用

fill

，但由于在事件绑定中调用了

函数.bind

，因此将

this

设置为

#target

示例：