javascript - .bind() 与事件处理程序

Question

假设我有以下简化功能。

var ex = document.getElementById('exampleElement'),
    data = {
        foo: 'Sample text'
    };

ex.addEventListener('click', function(evt, d) {
    evt.stopPropagation();
    this.innerHTML = d.foo;
}.bind(ex, null, data));

我意识到在这种特殊情况下绑定ex到this有些多余，但是我怎样才能绑定data参数并仍然保持event参数不被破坏？

我似乎无法在任何地方找到答案。

Answer 1

根据https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/bind

参数 1，参数 2，...

在调用目标函数时添加到提供给绑定函数的参数的参数。

这意味着您的咖喱值将出现在事件对象之前。看这个小提琴的例子：

http://jsfiddle.net/5w4vnvof/

var clickme = document.querySelector("#clickme");

clickme.addEventListener("click", function(value, event) {
    var newDiv = document.createElement("div");
    newDiv.innerHTML = value + "<br/>" + event.target.toString();

    document.body.appendChild(newDiv);
}.bind(clickme, "curriedValue"));