sui的一些方法封装 

+ 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>

 

posted on 2017-03-21 10:14  杨龙飞  阅读(1838)  评论(0)  编辑  收藏  举报

导航

Fork me on GitHub