zoukankan      html  css  js  c++  java
  • Knockoutjs 实践入门 (3) 绑定数组

    <form id="form1" runat="server">
            <div>
                <!--text value绑定model:itemToAdd,valueUpdate:更新数据绑定时机:按键时-->
                <!---如果不指定valueUpdate,使用默认更新数据绑定,经试验并不是onchange-->
                <input type="text"  data-bind='value:itemToAdd, valueUpdate: "afterkeydown"'/>
                 <!--button enable:绑定itemToAdd,click事件绑定model.addItem方法-->
                <input type="button" value="Add" data-bind='enable:itemToAdd().length>0,click:addItem'  />

            </div>
            <div>
                <!--select.options  绑定model.dataSource -->
                <select  multiple="multiple" style="200px" data-bind="options:dataSource"></select>
            </div>
        </form>
         <script type="text/javascript">
             var model = function (items) {
                 //绑定数据源
                 this.dataSource = ko.observableArray(items);
                 //绑定observable:最终返回输入值,itemToAdd就是绑定输入值
                 this.itemToAdd=ko.observable("");
                 this.addItem = function () {
                     if (this.itemToAdd() != "") {
                         alert(this.itemToAdd());
                         //插入获取的输入值
                         this.dataSource.push(this.itemToAdd());
                         //输入值清空
                         this.itemToAdd("");
                     }
                     
                     //this 设置为model
                 }.bind(this);
             };

             //初始化model
             ko.applyBindings(new model(["aaa","bbb","ccc"]));
        </script>

  • 相关阅读:
    JQuery-Ajax后台提交数据与获取数据 Java代码
    有趣的浏览器地址栏js代码
    浏览器地址栏运行JavaScript代码
    玩转博客园的几个快捷方式
    json.stringify()和json.parse()
    点击按钮追加元素和元素内容
    document的属性与方法小结
    window对象的方法和属性汇总
    Number()、parseInt()、parseFloat()的区别
    详解JS中Number()、parseInt()和parseFloat()的区别
  • 原文地址:https://www.cnblogs.com/hbb0b0/p/4501587.html
Copyright © 2011-2022 走看看