javascript - 旋转时使用 MVVM 更新 Kendo NumericTextBox

Question

看看 MVVM 示例 here :

如何获取 MVVM 值以在旋转事件(单击向上或向下箭头)时更新

这是我尝试过的:

在旋转事件中，我尝试做

$("#ntb").getKendoNumericTextBox().trigger("change");

这有效但有奇怪的副作用。

如果 DOM 上有足够的元素，旋转事件将继续触发。

重现此问题的另一种方法是从 here (jsbin) 中获取代码

将其插入到 HTML 文件中，在 Chrome 或 FF 中加载它，然后在此行插入一个断点:

$("#ntb").getKendoNumericTextBox().trigger("change");

继续点击继续，你会看到断点一次又一次地被命中。

在 firefox 中，如果我的 DOM 足够大，我会得到一个没有断点的重现。

Answer 1

我检查了你的 jsbin我在 html 和 javascript 中看到了一些错误。我认为当您测试不同的代码时，您忘记了更正它。无论如何，我清理并更正您的代码并将它们放入此 jsfiddle .

放置断点后 (debugger;) 我看到你是对的 onSpin 事件无限触发但是如果你在事件中放置断点就会发生这种奇怪的行为。如果您删除断点并放置一个 console.log("onSpinevent triggered.");，您会发现一切正常并且事件只触发了一次。

我以前在不同的场景中遇到过这样的问题，例如使用 alert() 而不是 console.log() 进行调试。

---

代码:

var viewModel = kendo.observable({
    selectedNumber: 0,
    isEnabled: true,
    isVisible: true,
    onSpin: function () {
        //debugger;
        console.log("`onSpin` event triggered.");
        $("#ntb").getKendoNumericTextBox().trigger("change");
    },
    onChange: function () {}
});
kendo.bind($("#example"), viewModel);