发布一个简单的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>
说起来没搞懂什么标准能上首页什么标准不能上首页,之前写的冷知识系列个人感觉挺好玩的可惜被赶下来了
发布一个简单的knockout-easyui绑定库的更多相关文章
- Java发布一个简单 webservice应用 并发送SOAP请求
一.创建并发布一个简单的webservice应用 1.webservice 代码: package com.ls.demo; import javax.jws.WebMethod; import ja ...
- 实现一个简单的Laravel的dd库
前几天写了一个简单的Laravel的dd库. 为什么自己要写一个这样的库? Laravel本身已经实现了自己的输出dd函数,但是我之所以要写这样一个库,一来是因为Laravel本身对这个库的封装没办法 ...
- 利用VS2008发布一个简单的webservice
一个开发好的webservice,怎样发布出去,供其他电脑访问呢? 本文将介绍如何发布一个简单的webservice,其中的内容都是在网上查看别人文章,自己仿照着做了一遍,因此,难免会发生错误,如果发 ...
- 发布一个简单的npm包
本文简单地记录了发布一个简单npm包的过程,以便后续参考使用. 初始化npm init 通过npm init创建一个package.json文件 D:\robin\lib\weapp-utils> ...
- 实现一个简单的C++协程库
之前看协程相关的东西时,曾一念而过想着怎么自己来实现一个给 C++ 用,但在保存现场恢复现场之类的细节上被自己的想法吓住,也没有深入去研究,后面一丢开就忘了.近来微博上看人在讨论怎么实现一个 user ...
- 一个简单的knockout.js 和easyui的绑定
<!DOCTYPE html><html><head><meta charset="UTF-8"><title>Basi ...
- 一个简单的 JSON 生成/解析库
这是一个单文件的,适用于C语言的, JSON 读写库. 先说明,不想造轮子,代码是从这里拿来的: https://www.codeproject.com/Articles/887604/jWrite- ...
- [development][tcp/ip][ids] 一个简单有参考价值的库 libnids
libhtp 中的例子, 可以通过libnids快速使用. 或者可以快速的写个sniffer. 支持三个功能 ip分片重组, tcp乱序重排, 端口扫描发现. 工程: https://github.c ...
- 从0到1发布一个npm包
从0到1发布一个npm包 author: @TiffanysBear 最近在项目业务中有遇到一些问题,一些通用的方法或者封装的模块在PC.WAP甚至是APP中都需要使用,但是对于业务的PC.WAP.A ...
随机推荐
- JS函数arguments数组获得实际传参数个数
JS与PHP在函数传参方面有点不同,PHP形参与实参个数要匹配,而JS就灵活多了,可以随意传参,实参比形参少或多都不会报错. 实参比形参多不会报错 ? 1 2 3 4 5 function say(a ...
- php与ascii码
首先 简单说一下历史,ascii码最开始是美国人搞出来的,用来干什么呢?我们知道,计算机只知道0和1,如果我们要计算机识别除了01之外的字符,例如 'a',我们要先告诉计算机‘1100001’就是'a ...
- Maven实战(五)坐标详解
1.为什么要定义Maven坐标 在我们开发Maven项目的时候,需要为其定义适当的坐标,这是Maven强制要求的.在这个基础上,其他Maven项目才能应用该项目生成的构件. 2.Maven坐 ...
- 服务器响应头隐藏X-power-by
服务器响应头隐藏X-power-by 这个不是Apache或者Nginx输出的,而是由语言解析器或者应用程序框架输出的. 这个值的意义用于告知网站是用何种语言或框架编写的.例如: PHP标准输出是:X ...
- yum 介绍
yum是一个用于管理rpm包的后台程序,用python写成,可以非常方便的解决rpm的依赖关系.在建立好yum服务器后,yum客户端可以通过 http.ftp方式获得软件包,并使用方便的命令直接管理. ...
- mysql 数据库备份
(2)使用命令行工具 备份数据库: mysqldump –user=root –password=root密码 –lock-all-tables 数据库名 > 备份文件.sql 恢复数据库: m ...
- codeforces 360 C - NP-Hard Problem
原题: Description Recently, Pari and Arya did some research about NP-Hard problems and they found the ...
- 4.Mybatis的输入映射(parameterType类型解析)
前面提到过Mybatis可以对输入的参数进行映射,那么现在我们来看一下输入映射,关于输入映射大概可以分为几种情况来学习: 1.基本的类型 2.实体类 3.包装类 1.参数是基本的类型(int,Stri ...
- 用jsch.jar实现SFTP上传下载删除
java类: 需要引用的jar: jsch-0.1.53.jar 关于jsch有篇文章关于目录的问题写得非常好:http://www.zzzyk.com/show/9f02969327434a6c.h ...
- oracle 同时更新(update)多个字段多个值
--创建表A,B: create table A (a1 varchar2(33),a2 varchar2(33),a3 varchar2(33)); create table B (b1 varch ...