我们有时候希望系统能自动刷新后台数据或者做某个动作,那么定时器的作用就体现出来了。

EasyMvc默认提供的服务器可以定时调前端方法与定时调后端方法,先看例子:

  • 定时调客户端事件

实现代码:

@Html.Q().Timer().Name("mxd").Interval(1000).ClickClientEvent("before")
<script>
var i = 0;
function before() {
i++;
layer.msg("客户端方法,结果为:" + i);
}
</script>

请注意:  

Interval 是用来设置定时器的时间间隔的。
ClickClientEvent 需要传入你希望调用的客户端方法名。

效果截图如下:

  • 定时调服务端事件

实现代码:

@Html.Q().Timer().Name("mxd").Interval(1000).ClickServerEvent("/Home/GetTime", null, "back")
<script>
i = 0;
function back(data) {
i++;
layer.msg("服务器返回的第" + i + "条消息:<br>" + data);
}
</script>

请注意:

ClickServerEvent 第一个参数为服务器的Action地址,第二个参数为JSON数据,第三个参数为回调的客户端方法,回调方法会自动携带服务器返回的数据data。

效果截图如下:

技巧:如果您同时触发了客户端方法与服务端方法,需要您在客户端方法里返回true,服务端方法才会被调用,意味着可以在触发服务端方法之前做一些客户端的校验等动作。
深入:本质上,定时器封装了js的setInterval方法。:)


总结:定时器的使用就简单介绍到这里,希望继续保持简单的心情。

更多使用示例请浏览在线示例:http://core.zwc.cn

EasyMvc入门教程-基本控件说明(2)定时器的更多相关文章

  1. EasyMvc入门教程-基本控件说明(8)提醒导航

    提醒导航顾名思义就是提醒大家注意某些文字了..请看下面的例子: 实现代码如下: @Html.Q().BlockRemind().Text("我可以作为提醒使用") 有的同学会说:这 ...

  2. EasyMvc入门教程-基本控件说明(11)菜单导航

    基本上,是个网站就会有菜单导航,目前流行的菜单是不是这样样子的? 似乎是bootstrap引领的风格,我们就用EasyMvc实现吧,上代码: @{ var data = new List<Men ...

  3. EasyMvc入门教程-基本控件说明(13)选项卡导航

    选项卡Tab导航主要用于企业页面显示不同子类或者子页面的信息内容. 先来一个基本的使用例子:代码如下: @{ var data = new List<TabItem>() { new Ta ...

  4. EasyMvc入门教程-图形控件说明(21)线形图+柱状图+饼形图

    本章将介绍一些基本但常用的图形:线型图,柱状图和饼形图. 以上三种图形对于的数据都是键值对数组,请参考第一个例子: @{ var data = new List<LineItem>(); ...

  5. EasyMvc入门教程-基本控件说明(1)按钮

    按钮是我们最常用的控件之一了,先看下我们提供的按钮风格: 不同颜色的: 实现代码: @Html.Q().Button().Text("Danger").ColorDanger() ...

  6. EasyMvc入门教程-基本控件说明(4)折叠面板

    折叠面板一般出现在管理后台,大家用的OutLook里就是用了折叠面板,样子大概是这样的: 把其中的内容替换成图标按钮,是不是就是我们常见的样子了?:)那么如何实现呢?请看例子: @{ var data ...

  7. EasyMvc入门教程-基本控件说明(6)进度条

    进度条的发明是很牛逼的,就如12306采用了队列解决了系统崩溃的问题一样..:) 进度条大家都见过,那么我们先来实现一个简单的进度条,请看例子: @Html.Q().Progress().Value( ...

  8. EasyMvc入门教程-基本控件说明(12)栏目导航

    栏目导航一般用来显示当前页面所在的模块层级位置关系,如下图所示: 当然也有前端网站作为小栏目导航,凡是没有绝对,只要不违和就好:),下面上代码: @{ var data = new List<N ...

  9. EasyMvc入门教程-基本控件说明(3)时间线

    我们有时候经常看到如下的页面: 或者快递物流信息图标,那么利用EasyMvc如何实现呢?很简单,看下面的例子: @{ var data=new List<TimeLineItem>() { ...

随机推荐

  1. python 使用 vscode 调试

    vscode安装python扩展,在vscode扩展管理器中搜索pyhon, 排名第一的就是我们需要下载的包—python.点击安装后重载窗体 点击调试–打开launch.json的按钮(那个小齿轮的 ...

  2. sql server 韩文查询匹配失败

    在SQL Server 中查询韩文信息时,没有匹配到对应的信息,检查程序后发现字段类型是nvarchar类型的没有问题, 打开存储过程后找到问题了:原来是拼接后的查询语句存储在一个varchar变量中 ...

  3. 【bzoj2132】圈地计划 网络流最小割

    题目描述 最近房地产商GDOI(Group of Dumbbells Or Idiots)从NOI(Nuts Old Idiots)手中得到了一块开发土地.据了解,这块土地是一块矩形的区域,可以纵横划 ...

  4. oracle 修改数据 保险方法

    oracle 中修改比较安全的方法:(pl/sql) 第一种方法: select * from temp where id=9 for update; 第二种方法: select t.*,rowid ...

  5. Databus架构分析与初步实践

    简介 Databus是一个低延迟.可靠的.支持事务的.保持一致性的数据变更抓取系统.由LinkedIn于2013年开源.Databus通过挖掘数据库日志的方式,将数据库变更实时.可靠的从数据库拉取出来 ...

  6. 面试:ios 批量上传图片

    这几天面试,被问到关于GCD的用法,想了想,之前项目好像确实用的比较少,只是知道怎么用,有思路,但是却从来没有试过,回来之后,就尝试写了下: 封装图片上传的方法 /**批量上传图片*/ + (NSUR ...

  7. 【HDOJ5510】Bazinga(KMP)

    题意:给定n个由小写字母组成的字符串,第i个字符串为a[i],求最大的j满足存在1<=i<j,a[i]不是a[j]的子串,无解输出-1 T<=50,n<=500,len[i]& ...

  8. 全球主要城市经纬度api

    原文发布时间为:2011-06-23 -- 来源于本人的百度文章 [由搬家工具导入] http://www.google.com/ig/cities?country=cn http://www.goo ...

  9. ashx接收参数 ashx传递参数

    原文发布时间为:2009-09-30 -- 来源于本人的百度文章 [由搬家工具导入] Handler.ashx文件: <%@ WebHandler Language="C#" ...

  10. Repeater的使用及其鼠标特效,行链接的使用

    原文发布时间为:2009-04-22 -- 来源于本人的百度文章 [由搬家工具导入] <asp:Repeater ID="rpt" runat="server&qu ...