zoukankan      html  css  js  c++  java
  • 发布一个简单的knockout-easyui绑定库

    最近做事情总是南辕北辙,拖延症越发严重了起来。原先计划早就要完成的这个项目也拖延了近两个月后总算勉勉强强发布了(最开始设想的部分功能就这么砍了,好吧纯粹个人太懒)

    knockout作为老牌的mvvm框架版本已经到3.X了,对个人来说能支持当前公司项目的目标浏览器————————

    IE8

    (对,混蛋就是你,IE8你看什么看?)

    而且还有详细的文档(嗯,基本上没有什么大问题,只发现少数几处浏览器兼容问题没写出)。

    jeasyui更不用说了,全套ui组件。虽然实现的不是很理想,不过至少能用。

    想把两者结合使用的,请猛戳此处。不过目前只编写了基本的绑定,需要复杂功能的请自行动手(欢迎提交代码,共同完善)。

    细节请查看工程的README文件

     参考示例:

    <!DOCTYPE html>
    <html>
    <head>
        <title>Demo</title>
        <link type="text/css" rel="stylesheet" href="contents/themes/default/easyui.css" />
        <script type="text/javascript" src="scripts/jquery-1.10.2.min.js"></script>
        <script type="text/javascript" src="scripts/jquery.easyui.min.js"></script>
        <script type="text/javascript" src="scripts/knockout-3.1.0.js"></script>
        <script src="../knockout-easyui-0.5.0.min.js"></script>
        <style>
            .width {
                width: 100px;
            }
        </style>
    </head>
    <body>
        <div class="content">
            <div>
                <input class="width" data-bind="comboboxSource:source,comboboxValue:value,easyuiOptions:viewSettings" />
            </div>
            <div data-bind="foreach:source">
                <input type="radio" data-bind="checked:$root.value,checkedValue:$data.code">
                <label data-bind="text:name"></label>
            </div>
        </div>
        <div class="model-display" data-bind="html:modelInfo"></div>
        <script>
            var model = {
                source: ko.observableArray([
                    { code: "1", name: 'HTML' },
                    { code: "2", name: 'JAVASCRIPT' },
                    { code: "3", name: 'CSS' }
                ]),
                value: ko.observable("2"),
    
                viewSettings: {
                    valueField: 'code',
                    textField: 'name'
                }
            }
    
            model.modelInfo = ko.computed(function () {
                var info = ko.toJS(model)
                delete info.viewSettings
                delete info.modelInfo
                return JSON.stringify(info);
            }),
            ko.applyBindings(model)
        </script>
    </body>
    
    </html>

    说起来没搞懂什么标准能上首页什么标准不能上首页,之前写的冷知识系列个人感觉挺好玩的可惜被赶下来了

  • 相关阅读:
    自己动手制作symbian签名
    中移动陈大庆:中国移动JAVA4.1规范和SDK工具
    角色扮演游戏引擎的设计原理
    小团队开发J2ME游戏的阶段划分
    角色扮演游戏中敌人AI(人工智能)的设计方法
    入门:Android 文档的阅读顺序
    2016 MultiUniversity Training Contest 1
    真我
    DBA是我的梦想
    解决VS2010自带的C/C++编译器CL找不到mspdb100.dll的问题
  • 原文地址:https://www.cnblogs.com/Nyarlathotep/p/3933036.html
Copyright © 2011-2022 走看看