/*
*@Product Name: Rational Framework
Author: Calos
Description: pager
!important: pager
*/
(function ($) {
$.fn.patpager = function (indexedReq) {
var indexedReqDefault = {
turnPageTriggered: function (indexer, transform) {
fetchIndexer(indexer, transform);
}, pageIndex: 1, pageSize: 10, pageCount: 10
};
indexedReq = $.extend(indexedReqDefault, indexedReq);
if (indexedReq.pageCount === 0) indexedReq.pageCount = 1;
var $this = $(this).addClass('patpager');
$this.data('initialized', false);
$this.children().remove();
var timestamp = new Date().getTime();
var caching = {};
function fetchIndexer(indexerTo, transform) {
if (indexedReq.turnPageTriggered) {
indexedReq.turnPageTriggered(indexerTo, transform);
}
}
var components = {
Turntopage: '<label>Turn to page</label>',
pageIndex: function (num) { return '<input type="text" class="pageTo" value=' + num + '>'; },
previousPage: '<a class="prev"></a>',
curStatus: function (pageIndex, totalPages) { return 'page <span class="cur">' + pageIndex + '</span> of <span class="totalPages">' + totalPages + '</span>'; },
nextPage: '<a class="next"></a>'
};
var methods = {
createPager: function (pageIndex, totalPage) {
var html = '<div class=' + timestamp + ' >' + components.Turntopage + components.pageIndex(pageIndex) + components.previousPage + components.curStatus(pageIndex, totalPage) + components.nextPage + '</div>';
$this.html(html);
},
refreshCache: function () {
caching = {
pageTo: $this.find('.pageTo'),
prev: $this.find('.prev'),
pageIndex: $this.find('.cur'),
totalPages: $this.find('.totalPages'),
next: $this.find('.next')
}
$(".prev,.next").css('cursor', 'pointer');
},
initPager: function (option) {
methods.createPager(option.pageIndex, option.pageCount);
this.refreshCache();
},
setCurrentPage: function (pageTo) { caching.pageIndex.text(pageTo >= 1 ? pageTo : 1) },
getCurrentPage: function () { return parseInt(caching.pageIndex.text()); },
ensureFirstPage: function () {
return this.getCurrentPage() === 1;
},
ensureLastPage: function () {
return this.getCurrentPage() === indexedReq.pageCount;
},
turnToPreviousPage: function () {
indexedReq.pageIndex = methods.getCurrentPage() - 1;
fetchIndexer(indexedReq, function () {
methods.setCurrentPage(indexedReq.pageIndex);
});
},
turnToNextpage: function () {
indexedReq.pageIndex = methods.getCurrentPage() + 1;
fetchIndexer(indexedReq, function () {
methods.setCurrentPage(indexedReq.pageIndex);
});
},
turnTopage: function (index) {
indexedReq.pageIndex = index;
fetchIndexer(indexedReq, function () {
methods.setCurrentPage(indexedReq.pageIndex);
});
},
ensureValidPageIndex: function () {
var i = caching.pageTo.val();
var c = parseInt(caching.totalPages.text());
if (i <= 0) { caching.pageTo.val(1); caching.pageIndex.text(1); return true; }
if (i >= c) { caching.pageTo.val(c); caching.pageIndex.text(c); return true; }
return /\d/gim.test(i) && i > 0 && i < parseInt(caching.totalPages.text());
}
};
var behaviors = {
prevClick: function () {
methods.turnToPreviousPage();
},
nextClick: function () {
methods.turnToNextpage();
}
}; var getFrame = function (selector) {
return '.' + timestamp + ' ' + selector;
} $this.on('click', getFrame('.prev'), function (e) {
if (!methods.ensureFirstPage())
behaviors.prevClick();
});
$this.on('click', getFrame('.next'), function (e) {
if (!methods.ensureLastPage())
behaviors.nextClick();
});
$this.on('keydown blur', getFrame('.pageTo'), function (e) {
var eType = $.inArray(e.type, ['focusout', 'keydown']);
if ((eType === 1 && e.keyCode === 13) || eType === 0) {
if (methods.ensureValidPageIndex()) {
var index = caching.pageTo.val();
methods.turnTopage(index);
}
}
}); methods.initPager(indexedReq);
$this.data('initialized', true);
return this;
}
})(jQuery);

  

 

兰州基于jquery 写了一个spa架构,不想解耦了

var TemplateEngine = function(html, options) {
var re = /<%([^%>]+)?%>/g, reExp = /(^( )?(if|for|else|switch|case|break|{|}))(.*)?/g, code = 'var r=[];\n', cursor = 0;
var add = function(line, js) {
js? (code += line.match(reExp) ? line + '\n' : 'r.push(' + line + ');\n') :
(code += line != '' ? 'r.push("' + line.replace(/"/g, '\\"') + '");\n' : '');
return add;
}
while(match = re.exec(html)) {
add(html.slice(cursor, match.index))(match[1], true);
cursor = match.index + match[0].length;
}
add(html.substr(cursor, html.length - cursor));
code += 'return r.join("");';
return new Function(code.replace(/[\r\t\n]/g, '')).apply(options);

  

最近兰州的js风格写个插件和一个template engine的更多相关文章

  1. 用原生js来写一个swiper滑块插件

        是不是有点印象了,没错,他的最基本的用法就是左右滑动,插件使用者只需要写几行简单的html和js即可实现一个简单滑动效果,不过你完全可以组合各种元素来适应不同的场景. 当然插件我已经写好了,咱 ...

  2. 「标准」的 JS风格

    首先,这份 JS风格指南已经在我司的前端团队实行半年多了: 其次,在程序员的世界里,从入行到资深都需要面对几个世界级的难题,如: 世界上最好的编辑器是什么? 是用空格还是 TAB?用空格还特么衍生出 ...

  3. bootstrap风格的multiselect插件——类似邮箱收件人样式

    在开发颗粒云邮箱的过程中,遇到了一个前端的问题,就是邮箱收件人的那个multiselect的input输入框.不仅能够多选,还要能够支持ajax搜索,把联系人搜索出来.就是类似下面的这个东西: 网上找 ...

  4. 用实例一步步教你写Jquery插件

    最近Web应用程序中越来越多地用到 了JQuery等Web前端技术.这些技术框架有效地改善了用户的操作体验,同时也提高了开发人员构造丰富客户 端UI的效率.JQuery本身提供了丰富的操作,但是,有时 ...

  5. 自己写jquery插件之模版插件高级篇(一)

    需求场景 最近项目改版中,发现很多地方有这样一个操作(见下图gif动画演示),很多地方都有用到.这里不讨论它的用户体验怎么样. 仅仅是从复用的角度,如果每个页面都去写text和select元素,两个b ...

  6. 锋利的jQuery--编写jQuery插件(读书笔记五)[完结篇]

    1.表单验证插件Validation   2.表单插件Form   3.动态事件绑定插件livequery 可以为后来的元素绑定事件   类似于jQuery中的live()方法     4.jQuer ...

  7. 什么?你还不会写JQuery 插件

    前言 如今做web开发,jquery 几乎是必不可少的,就连vs神器在2010版本开始将Jquery 及ui 内置web项目里了.至于使用jquery好处这里就不再赘述了,用过的都知道.今天我们来讨论 ...

  8. 写JQuery 插件 什么?你还不会写JQuery 插件

    http://www.cnblogs.com/Leo_wl/p/3409083.html 前言 如今做web开发,jquery 几乎是必不可少的,就连vs神器在2010版本开始将Jquery 及ui ...

  9. Qt写Activex插件 总结

    最近写的插件功能基本完成,也遇到了一些坑,在这里记录一下. 我写的这个插件的js接口是仿造google earth的js接口,尽可能的达到与它的api一致.先从最简单的说起: 1. 导出接口中的flo ...

随机推荐

  1. Windows注册表(持续更新)

    HKEY_CURRENT_USER\Software\Microsoft\Internet Explorer\Zoom 下, 设置DWORD 值 ZoomDisabled  等于 1.

  2. Java构造和解析Json数据的两种方法详解二

    在www.json.org上公布了很多JAVA下的json构造和解析工具,其中org.json和json-lib比较简单,两者使用上差不多但还是有些区别.下面接着介绍用org.json构造和解析Jso ...

  3. 【转】深入浅出 JavaScript 中的 this

    Java 等面向对象的语言中,this 关键字的含义是明确且具体的,即指代当前对象.一般在编译期确定下来,或称为编译期绑定.而在 JavaScript 中,this 是动态绑定,或称为运行期绑定的,这 ...

  4. MVC3下的layout页面

    1.Layout页基础:如果你有使用MasterPage的经验,你将会记得如下的几个东西 A:<%@ Master %> B:<%@ Page %> C:<asp:Con ...

  5. docker learning

    Docker 配置文件位置 Docker 的配置文件可以设置大部分的后台进程参数,在各个操作系统中的存放位置不一致 在 ubuntu 中的位置是:/etc/default/docker 在 cento ...

  6. c语言main函数返回值、参数详解(返回值是必须的,0表示正常退出)

    C语言Main函数返回值 main函数的返回值,用于说明程序的退出状态.如果返回0,则代表程序正常退出:返回其它数字的含义则由系统决定.通常,返回非零代表程序异常退出. 很多人甚至市面上的一些书籍,都 ...

  7. Java学习-038-JavaWeb_007 -- JSP 动作标识 - plugin

    plugin 动作时用来在 JSP 页面中加载 Java Applet 或者 JavaBean 组件,语法格式如下所示: <jsp:plugin type="bean|applet&q ...

  8. asp.net批量删除XML节点失败的原因及解决办法

    今天操作XML的时候,用到了批量循环删除节点.出现了问题,即循环未结束,程序就跳出循环.搞了好久才弄明白. 解决前的代码: XmlNodeList items = xn.ChildNodes; //获 ...

  9. 微信公众平台开发(84) 小i机器人

    很多朋友询问如何开发小黄鸡之类的智能聊天机器人,但遗憾的是小黄鸡接口申请页面在最近几个月里都无法访问,且使用时限制太大,我们找了另一个接口:小i机器人.本文介绍如何在微信公众平台中使用小i接口开发智能 ...

  10. Android 使用FACE++架构包实现人脸识别

    今天给大家带来一个通过使用Face++来实现人脸识别的功能. 我们先去这个Face++官网看看:http://www.faceplusplus.com.cn 我们点开案例可以看到众多我们熟知的软件都是 ...