index12.html
<html>
<head>
<title>grootJs属性扩展 groot.bindExtend</title>
<script src="jquery-1.11.2.min.js"></script>
<script src="groot.js"></script>
</head>
<body>
<div gt-view="myview">
<div style="background-color: forestgreen;" gt-width="w" gt-height="h"></div>
宽: <input type="text" gt-value-change="w"/>----高: <input type="text" gt-value-change="h"/>
</div>
</body>
</html>
<script>
var view = groot.view("myview", function (vm, ve) {
vm.w=200;
vm.h=200;
});
</script>
上面的 gt-width,gt-height 为扩展属性
扩展属性的定义groot.bindExtend
groot.bindExtend(
{
"Name": "show",
"Handler": function (elment, value) {
if (value == true) {
elment.show();
} else {
elment.hide();
}
}
}
,
{
"Name": "height",
"Handler": function (elment, value) {
elment.height(value);
}
}
,
{
"Name": "width",
"Handler": function (elment, value) {
elment.width(value);
}
}
);
Name 为属性名称 Handler 为处理程序 有两个参数 element 为 属性所在的 docment对象，value 为扩展属性的值