knockout.js--基本用法

<p data-bind="with:lines">
    单价：<input type="text" data-bind=‘value:productPrice,  valueUpdate: "afterkeydown"‘ />
    数量：<input type="text" data-bind=‘visible:productPrice() > 0,value: productCount, valueUpdate: "afterkeydown"‘ />
    小计：<span data-bind="text:total"></span>

</p>
<script type="text/ecmascript">
    var product = function () {
        self = this;
        self.id = 1;
        self.name = "测试产品";
        self.productPrice = ko.observable("0"); //ko.observable会先设置值再返回一个函数赋值给 价格（self.productPrice）,价格就被实时监控，通过productPrice()获取属性值，通过productPrice("4567")改变变量的值
        self.productCount = ko.observable("1");
        self.total = ko.computed(function () {

            return self.productCount() * self.productPrice();
        });
    }
    var products = function () {
        var self = this;
        self.lines = ko.observable(new product());//new 实例化一个函数==view model，或直接声明一个对象成为view model
    }
    ko.applyBindings(new products());//data-bind将viewmodel和HTML关联一起，但是浏览器不能识别data-bind，ko.applyBindings(ele1,ele2)激活knockout。applyBindings有两个参数，第一个为必选(创建viewModel），第二个可选用来指定knockout控制HTML的范围。
</script>