zoukankan      html  css  js  c++  java
  • knockout 与checkbox联动

    knockout 通过teplate实现简单的代码实现复杂的操作绑定checkbox,代码如下自我感觉很赞!!!

    前台HTml

    <ul data-bind="template: { name: 'choiceTmpl', foreach: choices, templateOptions: { selections: selectedChoices } }">
    </ul>
    <script id="choiceTmpl" type="text/html">
     < li > <input type = "checkbox"data - bind = "attr: { value: $data }, checked: $item.selections" / ><span data - bind = "text: $data" > </span>     </li >
    </script>
    <hr />
    <div data-bind="text: ko.toJSON(selectedChoices)">
    </div>
    <hr />
    <div data-bind="text: selectedChoicesDelimited">
    </div>

    前台JS

    var viewModel = {     choices: ["one", "two", "three", "four", "five"],     selectedChoices: ko.observableArray(["two", "four"]) };

    viewModel.selectedChoicesDelimited = ko.dependentObservable(function() {     return this.selectedChoices().join(","); }, viewModel);

    ko.applyBindings(viewModel);

    在线Fiddle演示如下

    http://jsfiddle.net/rniemeyer/Jm2Mh/

  • 相关阅读:
    将个人博客与github关联
    docker镜像制作
    perf命令
    vmstat命令
    ps命令
    top命令
    linux查看当前用户登陆信息
    .NET CORE应用程序启动
    WebAPI简介
    Redis-位图
  • 原文地址:https://www.cnblogs.com/brucehome/p/3249689.html
Copyright © 2011-2022 走看看