TopList标签和JavaScript结合两例


Posted in Javascript onAugust 12, 2007

 (SteamCMS)Fish模版专贴一:TopList标签和JavaScript结合两例 
首先可以先参考 SteamCMS 标准模版标签说明 来了解一下TopList标签及其属性。 
在Top列表的记录前加上数字(当然也可以是图片,这里只是简单的举个例子)。
原理说明:先在最前面初始化一个js变量,在TopList中间,将Js变量加1,并在TopList循环体中间输出(我写asp代码一样的道理)

关键代码: 

<body>
<script language="javascript">
//全局变量
var i=1;
//输出i,并i自增
function doit(){
document.write(i);
i++;
}
</script>
<!--Steam:TopList ChannelID='0' Type='Commend' IsTop='False' HasImage='False' Number='20' Cols='1' EnterTag='' -->
    <script language="javascript">doit();</script>.<!--Steam:ContentField FieldName='Title' Length='-1' /-->
<!--/Steam:TopList--> 

</body>  

代码中,绿色部分定义了一个全局变量i,和一个函数doit。doit函数在循环体的红色部分运行,输出i。蓝色为TopList标签。红色代码后面的暗黄色是标题。上面代码的结果就会在每条记录前加上数字。简单吧。嘿嘿。 

第二例:每隔五行插入一空行,如:
在Top列表每隔五行插入一空行(当然也可以是图片,或者其他负责的代码)。
原理说明:先在最前面初始化一个js变量,在TopList中间,将Js变量加1,并在TopList循环体中计算此js变量是否被5整除,是就输出空行。 

 

关键代码:

<body>
<script language="javascript">
//全局变量
var i=1;
//输出i,并i自增
function doit(){
if(i%5==0){//是否被5整除
  document.write("<br />");
}
i++;
}
</script>
<!--Steam:TopList ChannelID='0' Type='Commend' IsTop='False' HasImage='False' Number='20' Cols='1' EnterTag='' -->
    <!--Steam:ContentField FieldName='Title' Length='-1' /--><script language="javascript">doit();</script>
<!--/Steam:TopList-->

</body>

代码中,绿色部分定义了一个全局变量i,和一个函数doit。doit函数在循环体的红色部分运行,判断是否被5整除,是就输出<br>。蓝色为TopList标签。红色代码前面的黄色是标题。上面代码的结果就会在每隔五行插入一空行。简单吧。嘿嘿。

Javascript 相关文章推荐
通用javascript脚本函数库 方便开发
Oct 13 Javascript
jQuery对象与DOM对象之间的转换方法
Apr 15 Javascript
jquery 实现窗口的最大化不论什么情况
Sep 03 Javascript
JS JQUERY实现滚动条自动滚到底的方法
Jan 09 Javascript
jquery获取所有选中的checkbox实现代码
May 26 Javascript
AngularJS实现分页显示数据库信息
Jul 01 Javascript
JavaScript简单获取系统当前时间完整示例
Aug 02 Javascript
JavaScript和JQuery获取DIV值的方法示例
Mar 07 Javascript
详解微信小程序Radio选中样式切换
Jul 06 Javascript
BootStrap Fileinput插件和Bootstrap table表格插件相结合实现文件上传、预览、提交的导入Excel数据操作步骤
Aug 07 Javascript
基于js实现数组相邻元素上移下移
May 19 Javascript
VUE项目axios请求头更改Content-Type操作
Jul 24 Javascript
Javascript-Mozilla和IE中的一个函数直接量的问题分析
Aug 12 #Javascript
IE和Mozilla的兼容性汇总event
Aug 12 #Javascript
收藏Javascript中常用的55个经典技巧
Aug 12 #Javascript
JavaScript-世界上误解最深的语言分析
Aug 12 #Javascript
用javascript实现兼容IE7的类库 IE7_0_9.zip提供下载
Aug 08 #Javascript
alixixi runcode.asp的代码不错的应用
Aug 08 #Javascript
网上应用的一个不错common.js脚本
Aug 08 #Javascript
You might like
PHP.MVC的模板标签系统(四)
2006/09/05 PHP
dede3.1分页文字采集过滤规则详说(图文教程)
2007/04/03 PHP
THINKPHP+JS实现缩放图片式截图的实现
2010/03/07 PHP
PHP基于DOMDocument解析和生成xml的方法分析
2017/07/17 PHP
在IE,Firefox,Safari,Chrome,Opera浏览器上调试javascript
2008/12/02 Javascript
开发中可能会用到的jQuery小技巧
2014/03/07 Javascript
javascript中caller和callee详解
2015/08/10 Javascript
Javascript实现鼠标框选操作  不是点击选取
2016/04/14 Javascript
基于Bootstrap实现的下拉菜单手机端不能选择菜单项的原因附解决办法
2016/07/22 Javascript
js仿百度音乐全选操作
2017/01/13 Javascript
webpack进阶——缓存与独立打包的用法
2017/08/02 Javascript
layui多iframe页面控制定时器运行的方法
2019/09/05 Javascript
js实现掷骰子小游戏
2019/10/24 Javascript
Python 返回汉字的汉语拼音
2009/02/27 Python
Python中的高级数据结构详解
2015/03/27 Python
Django 迁移、操作数据库的方法
2019/08/02 Python
使用Python制作一个打字训练小工具
2019/10/01 Python
Python队列、进程间通信、线程案例
2019/10/25 Python
python/Matplotlib绘制复变函数图像教程
2019/11/21 Python
python对数组进行排序,并输出排序后对应的索引值方式
2020/02/28 Python
python多维数组分位数的求取方式
2020/03/03 Python
Casadei卡萨蒂官网:意大利奢侈鞋履品牌
2017/10/28 全球购物
荷兰和比利时时尚鞋店:Van Dalen
2018/04/23 全球购物
C#中有没有运算符重载?能否使用指针?
2014/05/05 面试题
感恩母亲节活动方案
2014/03/04 职场文书
高中课前三分钟演讲稿
2014/08/18 职场文书
个人三严三实对照检查材料思想汇报
2014/09/22 职场文书
教师批评与自我批评材料
2014/10/16 职场文书
幼儿园五一劳动节活动总结
2015/02/09 职场文书
物业工程部主管岗位职责
2015/04/16 职场文书
小时代观后感
2015/06/10 职场文书
红色影片观后感
2015/06/18 职场文书
golang 生成对应的数据表struct定义操作
2021/04/28 Golang
Python3 类型标注支持操作
2021/06/02 Python
FP-growth算法发现频繁项集——构建FP树
2021/06/24 Python
vue判断按钮是否可以点击
2022/04/09 Vue.js