Konckout第一个实例:简单数据模型绑定

Konck是什么:

http://www.aizhengli.com/knockoutjs/50/knockout.html

使用:直接引入knockout.js文件

第一个实例:实现输入框输入值改变后,文本显示随之改变

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <title></title>
        <style>
            #content1{padding: 20px;}
        </style>
    </head>
    <body>
        <div id="content1">
            name:<input type="text" id="userNameText" value="inputValue" data-bind="value:UserName" />
            <p>hello <b id="userNameView" data-bind="html:UserName">inputValue</b></p>
        </div>
        
        <script type="text/javascript" src="js/jquery.js"></script>
        <script type="text/javascript" src="js/knockout30.js"></script>
        <script>
            $(function(){
                var  ViewModel = function(){
                    var self = this;
                    self.UserName = ko.observable("");//这句话的意思就是knockout会监控UserName,当改变时,相应的会改变
                }
                var  currentViewModel = new ViewModel();
                ko.applyBindings(currentViewModel);//将对象绑到当前页面
            });
        </script>
    </body>
</html>
原文地址:https://www.cnblogs.com/by-dxm/p/6738520.html