jquery模板插件jTemplates代替拼html
发布日期:2021-09-10 06:26:23 浏览次数:2 分类:技术文章

本文共 3620 字,大约阅读时间需要 12 分钟。

jQuery的jTemplates插件允许定义一个显示模板,在展现数据时根据选择的模板来动态生成。

jQuery的jTemplates官方网站:http://jtemplates.tpython.com/

原先的拼html代码如下:

$("#Content").html("");    $.getJSON("ajax/item.ashx", { action: 'list', action2: 'getPerPageData', type: $("#hidType").val(), ym: $("#hidYM").val(), showType: $("#sShowType").val(), searchVal: $("#txtSearch").val(), pagesize: $("#sPageSize").val(), index: index, t: Math.random() }, function(data) {        $.each(data, function(i) {            var strHtml = "
"; strHtml += "
"; strHtml += "
"; strHtml += "
"; strHtml += "
"; strHtml += ""; strHtml += "" + data[i].Title + ""; strHtml += ""; strHtml += ""; strHtml += ""; strHtml += "" + data[i].TypeName + ""; strHtml += "
创建时间:" + data[i].CreateOn + "最后修改时间:" + data[i].ModifiedOn + "
" + data[i].Intro + "
详细...
"; $("#Content").append(strHtml); }) $(".markSelectBox").powerFloat({ width: 85, eventType: "click", target: ".qmpanel_shadow", }); });

 有了jTemplates,可以更灵活的定义一个模板 :

 调用:

$("#Content").html("");    $.getJSON("ajax/item.ashx", { action: 'list', action2: 'getPerPageData', type: $("#hidType").val(), ym: $("#hidYM").val(), showType: $("#sShowType").val(), searchVal: $("#txtSearch").val(), pagesize: $("#sPageSize").val(), index: index, t: Math.random() }, function(data) {        $("#Content").setTemplateElement("template", null, {filter_data: false});        $("#Content").processTemplate(data);         $(".markSelectBox").powerFloat({            width: 85,            eventType: "click",            target: ".qmpanel_shadow",                            });	                 });

 

转载地址:https://blog.csdn.net/weixin_34377065/article/details/85534631 如侵犯您的版权,请留言回复原文章的地址,我们会给您删除此文章,给您带来不便请您谅解!

上一篇:新版office365介绍
下一篇:C# SetCursorPos用法

发表评论

最新留言

哈哈,博客排版真的漂亮呢~
[***.90.31.176]2024年03月01日 13时31分44秒

关于作者

    喝酒易醉,品茶养心,人生如梦,品茶悟道,何以解忧?唯有杜康!
-- 愿君每日到此一游!

推荐文章

vba ado 执行多条mysql 语句_access 按钮 多条sql语句 VBA 2019-04-21
弹性方法计算连续梁板内力_(梁板结构)混凝土结构设计复习题及答案 2019-04-21
java root权限_android java获得root权限调用linux命令 | 学步园 2019-04-21
java最小化窗体_JAVA窗体最大化最小化控制+托盘 2019-04-21
java 注解 数组默认值_Java注解默认值 2019-04-21
java流程语句_Java流程控制语句 2019-04-21
java require_java正则中的requireEnd和hitEnd 2019-04-21
400错误java_java代码转化成c#代码 报400错误 2019-04-21
java常见对象_Java 常见对象 02 2019-04-21
spring java配置_Spring Java配置要点 2019-04-21
共享内存 java_java - Java客户端-服务器编程:客户端之间的共享内存 - 堆栈内存溢出... 2019-04-21
java布局管理器空布局_Java图形化界面设计——布局管理器之null布局(空布局)... 2019-04-21
java gas station_LeetCode – 774. Minimize Max Distance to Gas Station 2019-04-21
java项目无法加载到tomcat_eclipse+tomcat添加项目进来无法启动tomcat 2019-04-21
后缀树建立 java_实用算法实现-第 8 篇后缀树和后缀数组 [2 最长公共子串] 2019-04-21
java网络编程期末试题_java网络编程面试题【其中一小部分】 2019-04-21
estore java_estore2 - WEB源码|JSP源码/Java|源代码 - 源码中国 2019-04-21
java如何做表单校验_微信小程序实现表单校验功能 2019-04-21
matlab dwt2(),MATLAB小波变换指令及其功能介绍(超级有用) 2019-04-21
php sequelize,egg.js整合数据库ORM框架Sequelize 2019-04-21