浏览 2955 次
|
锁定老帖子 主题：jCT 使用教程之[嵌入模板]
精华帖 (0) :: 良好帖 (0) :: 新手帖 (0) :: 隐藏帖 (0)
|
|
|---|---|
| 作者 | 正文 |
|
发表时间：2008-09-02
更多信息请看我博客里的jCT专题 ，或者jCT开源主页示例 里面有最简单的例子
此教程是适用于jCT3版
为了书写方便例子中引用了jQuery库,为了方便不对样式进行控制
嵌入模板: 模板代码直接在最终的html页,经过jCT实例化后,重新表现在原页面上,这是最简单的一种用法
例1: 字母菜单,有些应用中需要快速的用字母A-Z做快速搜索,我们用jCT实现 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh-CN">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta http-equiv="Content-Language" content="zh-CN" />
<script type="text/javascript" src="/js/jquery.js"></script>
<script type="text/javascript" src="/js/jct.js"></script>
<script type="text/javascript">
$().ready(function(){
var Instance = new jCT($('#abcnav').html());
Instance.Build();
$('#abcnav').html(Instance.GetView());
});
</script>
</head>
<body>
<ul id="abcnav">
<!---for(var i=65;i<=90;i++){-->
<li><span>+-String.fromCharCode(i)-+</span></li>
<!---}-->
</ul>
</body>
</html>
从这个例子里,可以看出jCT的使用步骤
基本上就是这些步骤了,而事实上如果用jQuery的话一句就可以做好所有这些步骤 $('#abcnav').html(new jCT($('#abcnav').html()).Build().GetView());
声明：ITeye文章版权属于作者，受法律保护。没有作者书面许可不得转载。
推荐链接
|
| 返回顶楼 | |
|
发表时间：2008-09-09
现在我们把这简单的事情换另外一种写法
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh-CN">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta http-equiv="Content-Language" content="zh-CN" />
<script type="text/javascript" src="/js/jquery.js"></script>
<script type="text/javascript" src="/js/jct.js"></script>
<script type="text/javascript">
$().ready(function(){
var Instance = new jCT($('#abcnav').html()).Build();
});
</script>
</head>
<body>
<ul id="abcnav">
<!---/*+RunNow*/$('#abcnav').html(this.GetView());-->
<!---for(var i=65;i<=90;i++){-->
<li><span>+-String.fromCharCode(i)-+</span></li>
<!---}-->
</ul>
</body>
</html>
<!---/*+方法名称*/-->就是jCT文法用来定义成员方法的写法,对于上面的写法就是定义了一个RunNow的方法,这个方法里的内容是用来控制视图在页面上的具体表现的. 且RunNow方法具有自动执行特性,用这种方法达到了模板在页面上的表现直接写到了模板代码当中. |
| 返回顶楼 | |
|
发表时间：2008-09-14
还是google code写示例方便，写了3个最简单的嵌入模板的例子,例子很简单但是却完全表现出了jCT使用中的3种方法.其中第3中方法也是我推荐的方法，这个方法太灵活了。 用这个方法后可以把要扩展的对象定义写到独立的js文件里，这样模板文件主要负责样式问题，交由美工做，js交由js程序员做。 http://jsct.googlecode.com/svn/trunk/jCT/example/example1.html |
| 返回顶楼 | |
