0

我的 html 视图上有几个输入，我想添加这样的功能：当您将鼠标悬停在输入上并使用鼠标滚动时，该输入的值会发生变化（从数组中选择另一个索引用于文本输入或升序/descend 数字的值）。使用event绑定对我来说还不够，因为我对这些输入和不同的设置使用不同的视图模型，因此，我正在考虑使用扩展可观察值的扩展器，但我真的不知道如何定位事件（mousescroll在一个元素上）在那个扩展器中。扩展器是正确的方法，还是我应该坚持event在视图侧使用这些绑定？

4

1 回答 1

1

我相信自定义绑定处理程序是一种方法。所有模型到 DOM 的通信都应该通过处理程序完成。扩展器只是向可观察对象添加附加功能的方式。这是此类处理程序的示例：

ko.bindingHandlers.wheel = {
    init: function(element, valueAccessor) {
        var value = valueAccessor();
        var handler = function (e) {
                var delta = Math.max(-1, Math.min(1, (e.wheelDelta || -e.detail)));            
              value(value() + delta);
        };
        // IE9, Chrome, Safari, Opera
        element.addEventListener("mousewheel", handler, false);
        // Firefox
        element.addEventListener("DOMMouseScroll", handler, false);
    }
};

工作小提琴

于 2016-07-10T23:19:54.333 回答