weui

引用

    <!--weui-->
    <script src="~/lib/weui/weui.min.js"></script>
    <link href="~/lib/weui/weui.min.css" rel="stylesheet" />

    <!--jquery weui -->
    <link href="~/lib/jquery-weui/css/jquery-weui.min.css" rel="stylesheet" />
    <script src="~/lib/jquery-weui/js/city-picker.min.js"></script>
    <script src="~/lib/jquery-weui/js/jquery-weui.min.js"></script>
    <script src="~/lib/jquery-weui/js/swiper.min.js"></script>

时间格式化 

//时间格式化
    Date.prototype.Format = function (fmt)
    {
        //author: meizz
        var o = {
            "M+": this.getMonth() + 1, //月份 
            "d+": this.getDate(), //日 
            "H+": this.getHours(), //小时 
            "m+": this.getMinutes(), //分 
            "s+": this.getSeconds(), //秒 
            "q+": Math.floor((this.getMonth() + 3) / 3), //季度 
            "S": this.getMilliseconds() //毫秒 
        };
        if (/(y+)/.test(fmt)) 
fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length));
        for (var k in o)
            if (new RegExp("(" + k + ")").test(fmt))
 fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) 
: (("00" + o[k]).substr(("" + o[k]).length)));
        return fmt;
    }

    //加载时间选择控件
    $("#datepicker-start").datetimePicker({
        title: "请选择开始日期",
        value: new Date().Format("yyyy-MM-dd") + " 00:00",
        max: new Date().Format("yyyy-MM-dd"),
    });
    $("#datepicker-end").datetimePicker({
        title: "请选择结束日期",
        value: new Date().Format("yyyy-MM-dd") + " 23:59",
        max: new Date().Format("yyyy-MM-dd"),
    });
    $("#picker-date").val(new Date().Format("yyyy/MM/dd"));
    $("#picker-date").calendar();

安全按钮

$.showLoading("正在提交...");
$(this).attr('disabled', true); 

$.hideLoading();
$(this).attr('disabled', false);

延迟执行

setTimeout(function ()
{
    //window.location.reload();//刷新当前页面.
    self.location = document.referrer;//返回上一页
}, 1000)   

查询页面 

<div class="main-control">
    <div class="weui-flex">
        <div class="weui-flex__item">
            <div class="weui-cells__title">
                <H3>查询</H3>
            </div>
            <div class="weui-cells ">
                <div class="weui-cell">
                    <div class="weui-cell__hd"><label class="weui-label">开始时间</label></div>
                    <div class="weui-cell__bd">
                        <input class="weui-input" type="text" id="datepicker-start">
                    </div>
                </div>
                <div class="weui-cell">
                    <div class="weui-cell__hd"><label class="weui-label">结束时间</label></div>
                    <div class="weui-cell__bd">
                        <input class="weui-input" type="text" id="datepicker-end">
                    </div>
                </div>
                <div class="weui-cell">
                    <div class="weui-cell__hd"><label class="weui-label">选择类型</label></div>
                    <div class="weui-cell__bd">
                        <input class="weui-input" type="text" id="picker-type">
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="weui-flex">
        <div class="weui-flex__item">
            <button class="weui-btn weui-btn_primary" id="ok">查询</button>
        </div>
    </div>
    <div class="weui-flex">
        <div class="weui-flex__item">
            <table class="layui-table" lay-filter="mytable" id="mytable"></table>
        </div>
    </div>
</div>

上下滑动菜单 

        $("#picker-type").picker({
            title: "请选择查询类型",
            cols: [
                {
                    textAlign: "center",
                    values: ["全部", "Phone5", "Phone6"],
                },
            ]
        });