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>

  • 相关阅读:
    初识增长黑客Growth Hacker
    OpenCV学习目录(持续更新)
    leetcode算法-回文判断
    leetcode算法-整数反转
    日常撸题技巧【总结】
    hihocoder 题目类型整理
    【hiho】92-93--素数【数论】
    notepad打造成C/C++IDE【Notepad】
    ACM知识点总结【杂】
    Nastya Studies Informatics
  • 原文地址:https://www.cnblogs.com/hbb0b0/p/4501587.html
Copyright © 2011-2022 走看看