javascript - 删除复选框会使下面的复选框在 meteor 中选中

Question

当您单击输入复选框时，我有一个运行的 meteor 单击事件处理程序。

调用“setTaskCompleted”更新django中的模型，将taskCompleted设置为true。 (我使用 django 来存储我的数据)

setCustomerTodo(customer):获取当前登录用户的待办事项。

一切正常，但是当我单击复选框时，它会从 View 中删除该字段并将其在 django 模型中标记为已完成。但它使输入位于检查的下方。

"click input[type='checkbox']": function(){
        //changing state task completed 
        this.completed = !this.completed;

        //getting active user
        var customer = Session.get('active_user').player_number 

        var data = {'task_id': this.id,
                    'completed': this.completed };

        //Changing state of task completed
        Meteor.call('setTaskCompleted', data, function(error, result){
            if(error){
                console.log(error);
            }else{
                setCustomerTodo(customer);
            }
        });
    }

//辅助函数

Checkbox Helper Function:
Template.tasks.helpers({
    data: function(){
        return Session.get('todo');
     }
});

//模板

{{#each data}}
    <tr>
        <td><input class="check-completed" checked="{{completed}} " type="checkbox"></td>
        <td>{{todo}}</td>   
    </tr>
{{/each}}

Answer 1

您的浏览器正在处理点击事件，您也在处理(您的 {{completed}})。尝试将 preventDefault() 添加到事件的开头:

"click input[type='checkbox']": function(event){
    event.preventDefault();
    //changing state task completed 
    this.completed = !this.completed;