敲除js-css biniding不't保存更改

knockout js css biniding doesn't save changes

本文关键字：保存更改 js-css biniding 敲除      更新时间：2023-09-26

敲除js-css-biniding在div的类被更改后不会保存更改：我的模型包含2个属性：

man: '',
woman: 'active'

我在dom中有2个元素，这些类可以更改。

<input type='button' value='Is MAN?' class='' data-bind='css: man'>
<input type='button' value='Is WOMAN?' class='' data-bind='css: woman'>

我想通过更改html元素类来更改模型的属性。例如：如果我们将类"active"添加到

<input data-bind='css: man' class='active' />

我们的模型属性"man"变为"active"。还有其他方式。

小提琴上的工作示例：http://jsfiddle.net/LkqTU/24843/

我做了一些修改，使代码可以管理

想法是将class到html控件的设置留给基于布尔道具的真/假的viewModel

视图：

<!-- ko foreach:people -->
PERSON DATA
<br/>
<input type='button' value='Is MAN?' class='' data-bind="css:{'active':man},,click:mClick" ><br/>
<input type='button' value='Is WOMAN?' class='' data-bind="css:{'active' : woman},click:wClick"><br/><br/>
<!-- /ko -->

view模型：

var data = {
    persons:[
        new PersonViewModel({
            man: false,
            woman: true
        }),
        new PersonViewModel({
            man: true,
            woman: false
        })
    ]
};
function PersonViewModel(data){
    var self = this;
    self.man = ko.observable(data.man);
    self.woman = ko.observable(data.woman);
     self.mClick=function(){
      self.man(!self.man())
    }
      self.wClick=function(){
      self.woman(!self.woman())
    }
}
var applicationVM = function (data) {
    var self = this;
    self.people = ko.observableArray(data.persons);
    self.savechanges = function() {
        alert(ko.toJSON(self.people));
    };  
};
$(document).ready(function() {
    ko.applyBindings( new applicationVM(data) );
});

样品工作小提琴此处

相关文章：