Javascript, jquery, backbone, splunk : on ("change", {data}, handler) 导致 TypeError

Question

我试图在 Splunk 的仪表板上观察(并在必要时更改)多选选择。为此，我在 Javascript 中获取多选并监听其上的“更改”事件。在更改时，我运行一个接收多选的函数以检查和调整选择。

我的代码大致如下:

// Get the multiselect
var multi1 = splunkjs.mvc.Components.getInstance("input1");

// Function to check selection
function smartSelector(container){
    var multi = container.multi;
    var selection = multi.val();
    if (...) {
        // Change selection
        ...
        // Set new selection to multi and refresh item
        multi.val(selection);
        multi.render();
    }
};

// On change, run function
multi1.on("change", function () {smartSelector({multi: multi1})});

这很好用。但据我所知，有一种更漂亮的方法来定义事件的处理程序和数据，例如来自 w3schools 的示例。 :

function doIt(event) {
    alert(event.data.msg);
}

$(document).ready(function () {
    $("p").on("click", {msg: "You just clicked me!"}, doIt)
});

但是，当我像这样将其应用于我的代码时:

// Fetch another multiselect
var multi2 = splunkjs.mvc.Components.getInstance("input2");

// Adjust function code to get event data
function smartSelector(event){
    var multi = event.data.multi;
    ...
}

// Adjust on("change", ...) to work with event data and handler
multi2.on("change", {multi: multi2}, smartSelector);

我在 mvc.js:6:108716 得到一个 TypeError: (intermediate value).callback.call is not a function，我认为这是 Backbone (作为 Splunk 的一部分)。

这是什么原因，我该怎么做才能实现正确的行为？谢谢你的想法。

Answer 1

啊，我想我明白了。on(...) 的使用方式与 jquery 不同, 但带有 Backbone .你需要这样做:

multi2.on("change", smartSelector, {multi: multi2});

通常，您使用上下文值在您调用的函数中设置 this 到另一个上下文，起初听起来不像我想要的东西。但这正是我所需要的，所以在我的例子中，我不得不在 smartSelector 中使用以下代码:

function smartSelector(){
    var multi = this.multi;
    var selection = multi.val();
    ...

感谢 squall3d 让我知道我可能没有使用正确的 on(...)!