发布一个简单的knockout-easyui绑定库

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

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

IE8

发布一个简单的knockout-easyui绑定库(对,混蛋就是你,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>

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

上一篇:makefile 学习网站


下一篇:Learning JavaScript Design Patterns The Module Pattern