您的位置：首页 > 产品设计 > UI/UE

sui的一些方法封装

2017-03-21 10:14 183 查看

+ function($) {
"use strict";

var today = new Date();

var getDays = function(max) {
var days = [];
for(var i=1; i<= (max||31);i++) {
days.push(i < 10 ? "0"+i : i);
}
return days;
};

var getDaysByMonthAndYear = function(month, year) {
var int_d = new Date(year, parseInt(month)+1-1, 1);
var d = new Date(int_d - 1);
return getDays(d.getDate());
};

var formatNumber = function (n) {
return n < 10 ? "0" + n : n;
};

var initMonthes = ('01 02 03 04 05 06 07 08 09 10 11 12').split(' ');

var initYears = (function () {
var arr = [];
for (var i = 1950; i <= 2030; i++) { arr.push(i); }
return arr;
})();

var defaults = {

rotateEffect: false,  //为了性能

value: [today.getFullYear(), formatNumber(today.getMonth()+1)],

onChange: function (picker, values, displayValues) {
var days = getDaysByMonthAndYear(picker.cols[1].value, picker.cols[0].value);
},

formatValue: function (p, values, displayValues) {
return displayValues[0] + '-' + values[1];
},

cols: [
// Years
{
values: initYears
},
// Months
{
values: initMonthes
}
]
};

$.fn.monthPicker = function(params) {
return this.each(function() {
if(!this) return;
var p = $.extend(defaults, params);
$(this).picker(p);
if (params.value) $(this).val(p.formatValue(p, p.value, p.value));
});
};
$.fn.selectedval = function(value){
var picker=this.data("picker");
var date=new Date(value);
var year=value.substr(0,4);
var month=value.substr(5,2);
var day=value.substr(8,2);
var hour=value.substr(11,2);
var minutes=value.substr(14,2);
value=[year,month,day,hour,minutes];
picker.initialized=true;
picker.value=value;
return false;
};
$.fn.setMinutes = function(value){
var picker=this.data("picker");
picker.params.cols[6].values=value;
};
$.fn.setDataSource = function(datasource){
var picker=this.data("picker");
picker.open();
picker.cols[0].replaceValues(datasource);
};
}(Zepto);

monthPicker:只选择月份

selectedval:修改下拉框默认选择值

setminutes:修改分钟的数据源；

setDataSource:修改下拉框的数据源；

其实setDataSource可以写成跟setminutes一样的方法，只是我的产品需要，就不做修改了；

sui的scorll加载时，一定要提前执行，$.init();否则无效，我在最初使用时，老是看不到效果，就是因为这个，对比iscroll.js，sui的滚动更容易操作，兼容性也比较好

另外，sui是仿照framework7来写的，做了一些改进，framework7针对ios系统，sui同时支持ios和andriod

sui的sm.js一定要在body后面加载，否则没有效果，我在使用fremark模板时进行了相关配置，

<#macro weixin title="" css=[] script=[] systag=0>
<html>
<head>
<title>${title!""}</title>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="initial-scale=1, maximum-scale=1">
<#include "/include/weixin/link.ftl"/>
<#list css as c>
<link rel="stylesheet" type="text/css" href="${c}" />
</#list>
<script src="${basePath}/weixin/js/zepto.min.js" charset="UTF-8"></script>
</head>
<body>
<#nested />
</body>
<#include "/include/weixin/script.ftl"/>
<#list script as s>
<script type="text/javascript" src="${s}" charset="UTF-8"></script>
</#list>
</html>
</#macro>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航