在悬停时尝试使用knockoutjs来切换复选框

时间:2015-11-17 18:04:56

标签: knockout.js

我正在尝试通过mouseover事件检查/取消选中复选框,但没有任何运气。

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <script src="Scripts/knockout-3.4.0.js"></script>
    <meta charset="utf-8" />
</head>
<body>
    <input type="checkbox" data-bind="event: {mouseover: toggle}" />
    <script type="text/javascript">
    function AppViewModel() {
        self = this;
        self.toggle = function () { this.checked = true; }; //doesn't work :(
    }
    ko.applyBindings(new AppViewModel());
    </script>
</body>
</html>

1 个答案:

答案 0 :(得分:1)

&#34; this&#34;在切换功能中指的是&#34;功能范围&#34;并指定已检查的财产在那里没有多大帮助。我不完全理解这里的最终要求,但如果您希望使用纯绑定并且没有DOM引用,则可以将代码修改为

 function AppViewModel() {
        self = this;
        self.checkedFlag=ko.observable();
        self.toggle = function () { 
            self.checkedFlag(true);
        }; //doesn't work :(
    }
    ko.applyBindings(new AppViewModel());

并标记为

 <input type="checkbox" data-bind="checked:checkedFlag,event: {mouseover: toggle}" />

并且鼠标悬停时会检查复选框,这里是您的参考提琴手 https://jsfiddle.net/cLu38jjt/1/