jQuery的模板与数据绑定插件

今天重典在群上说的这个,记录一下,以备后查。

ASP.NET AJAX 4.0中提供了客户端的数据绑定功能,相信大家都听说过了吧 ,有兴趣的可以看:Using ASP.NET AJAX Templates

废话不说,直接推荐两个jQuery的模板插件:

Chain.js

Hackszine.com: Chain.js - data binding for jQuery

http://www.hackszine.com/blog/archive/2008/08/chainjs_data_binding_ for_jquer.html

Data Binding Solution for jQuery

Chain.js - Data Binding Service for jQuery

Interaction.js - drag/drop/sort support for Chain.js

Chain.js这个不错,模板可以很干净.还支持拖动、排序、事件绑定等 等...

Demos:Demos for chain.js ;Demos for interaction.js;

点execute后的结果:

还有一个:

jTemplates - template engine in JavaScript

http://jtemplates.tpython.com/

这个带点入侵性,需要在模板中写上额外的标记!例如:

{#template MAIN}
<div id="header">{$T.name}</div>
<table>
{#foreach $T.table as r}
 {#include row root=$T.r}
{#/for}
</table>
{#/template MAIN}
{#template row}
<tr bgcolor="{#cycle values=['#AAAAEE','#CCCCFF']} ">
 <td>{$T.name.bold()}</td>
 <td>{$T.age}</td>
 <td>{$T.mail.link('mailto:'+$T.mail)}</td>
</tr>
{#/template row}

当然,看着这些标记,都可以知道这个在模板处理上可能要强些....

同类的jQuery客户端数据绑定插件还有好几个,相对功能略差,就不提 了....

时间: 2024-12-11 14:24:26

jQuery的模板与数据绑定插件的相关文章

jquery插件 - 模板与数据绑定插件

今天重典在群上说的这个,记录一下,以备后查. ASP.NET AJAX 4.0中提供了客户端的数据绑定功能,相信大家都听说过了吧,有兴趣的可以看:Using ASP.NET AJAX Templates 废话不说,直接推荐两个jQuery的模板插件: Chain.js Hackszine.com: Chain.js - data binding for jQueryhttp://www.hackszine.com/blog/archive/2008/08/chainjs_data_binding

Jquery 模板数据绑定插件的使用方法详解

本篇文章是对在Jquery中模板数据绑定插件的使用方法进行了详细的分析介绍,需要的朋友参考下   1 绑定后台数据到指定模板(无嵌套,内容均为后台数据原始信息,前台绑定)以通话记录页为例: 首先指定目标容器: 复制代码 代码如下:  <dl class="box_pannel_content_filled_border none" id="gvRecCalls">    <dd class="bg_blue">     &

jQuery自适应轮播图插件Swiper用法示例_jquery

本文实例讲述了jQuery自适应轮播图插件Swiper用法.分享给大家供大家参考,具体如下: 运行效果截图如下: 示例代码如下: <!DOCTYPE html> <html lang="zh-cn"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-sca

前端MVC学习总结(一)——MVC概要与angular概要、模板与数据绑定

一.前端MVC概要 1.1.库与框架的区别 框架是一个软件的半成品,在全局范围内给了大的约束.库是工具,在单点上给我们提供功能.框架是依赖库的.AngularJS是框架而jQuery则是库. 1.2.AMD与CMD 在传统的非模块化JavaScript开发中有许多问题:命名冲突.文件依赖.跨环境共享模块.性能优化.职责单一.模块的版本管理.jQuery等前端库层出不穷,前端代码日益膨胀 AMD规范及其代表:RequireJS异步模块定义(Asynchronous Module Definitio

RSS阅读器:15个基于jQuery的RSS阅读器插件

文章简介:本文介绍了15款实用的基于jQuery的RSS阅读器插件,有了它们的帮助,你可以轻松在网站中显示其他网站或博客的最近更新. 想要第一时间获得网站和博客的更新?RSS一直是最佳的选择.RSS提供的更新内容包括博客文章.新闻标题.标准格式的音频或视频等. 本文介绍了15款实用的基于jQuery的RSS阅读器插件,有了它们的帮助,你可以轻松在网站中显示其他网站或博客的最近更新. 1. jQuery RSS ATOM Feed Button 这款阅读器的功能十分完善. 源码/演示 2. jQu

jquery任意位置浮动固定层插件用法实例

  本文实例讲述了jquery任意位置浮动固定层插件用法.分享给大家供大家参考.具体分析如下: 说明:可以让指定的层浮动到网页上的任何位置,当滚动条滚动时它会保持在当前位置不变,不会产生闪动 2009-06-10修改:重新修改插件实现固定浮动层的方式,使用一个大固定层来定位 2009-07-16修改:修正IE6下无法固定在top上的问题 09-11-5修改:当自定义层的绝对位置时,加上top为空值时的判断 这次的方法偷自天涯新版页 经多次测试,基本上没bug~ 调用: 1 无参数调用:默认浮动在

jQuery异步上传文件插件ajaxFileUpload详细介绍

这篇文章主要介绍了jQuery异步上传文件插件ajaxFileUpload详细介绍,本文首先讲解了ajaxFileUpload的参数.错误提示等知识,然后给出了简单使用实例和ASP.NET MVC模式下的使用实例,需要的朋友可以参考下     一.ajaxFileUpload是一个异步上传文件的jQuery插件. 传一个不知道什么版本的上来,以后不用到处找了. 语法:$.ajaxFileUpload([options]) options参数说明: 1.url 上传处理程序地址. 2,fileEl

jQuery实现拖拽效果插件的方法

 这篇文章主要介绍了jQuery实现拖拽效果插件的方法,较为详细的分析了jQuery拖拽效果的实现技巧,需要的朋友可以参考下     本文实例讲述了jQuery实现拖拽效果插件的方法.分享给大家供大家参考.具体如下: 下面的jQuery插件允许你通过鼠标右键点击拖动overflow的元素,这个插件可以在移动设备上运行 ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 3

基于jQuery实现网页进度显示插件

 这篇文章主要介绍了基于jQuery实现网页进度显示插件的实现方法以及源码下载,十分的详细,并自带2种皮肤,这里推荐给小伙伴们.     相信大家都见过类似的网站功能,这种形式的进度显示可以很方便的让用户去理解和操作, 以下是插件的测试截图 ,提供了两个皮肤 使用js编写 可以灵活的生成进度条 方便进对一些工作进度进行图形显示 1.简单的调用 //所有步骤的数据 var stepListJson=[{StepNum:1,StepText:"第一步"}, {StepNum:2,StepT