MUI框架 picker日期选择器实例_.NET_编程开发_程序员俱乐部

中国优秀的程序员网站程序员频道CXYCLUB技术地图
热搜:
更多>>
 
您所在的位置: 程序员俱乐部 > 编程开发 > .NET > MUI框架 picker日期选择器实例

MUI框架 picker日期选择器实例

 2017/9/7 3:09:01  ##Finder&  程序员俱乐部  我要评论(0)
  • 摘要:MUI官方文档点我(一)准备工作,下载相关的js、cs文件,地址(二)新建普通html页面1)引入相关js、cs文件2)一个input,记录下id:<form><labelfor="dateSelect">请选择日期</label><inputtype="text"id="dateSelect"/></form>3)核心代码:<scripttype="text/javascript">$(function(){$
  • 标签:实例

MUI官方文档点我

(一)准备工作,下载相关的js、cs文件,地址

(二)新建普通html页面

  1)引入相关js、cs文件

  2) 一个input,记录下id:

<form>
         <label for="dateSelect">请选择日期</label>
         <input type="text" id="dateSelect"/>
</form>

 

3)核心代码:

<script type="text/javascript">
    $(function () {
        $("#dateSelect").click(function () {
            var dtPicker = new mui.DtPicker({ type: 'date' });
            /*参数:'datetime'-完整日期视图(年月日时分)
                    'date'--年视图(年月日)
                    'time' --时间视图(时分)
                    'month'--月视图(年月)
                    'hour'--时视图(年月日时)
            */      
            dtPicker.show(function (selectItems) {
               var y = selectItems.y.text;  //获取选择的年
               var m = selectItems.m.text;  //获取选择的月
               var d = selectItems.d.text;  //获取选择的日
               var date = y + "-" + m + "-" + d ; 
               $("#dateSelect").val(date); 
            })
        });
    })
</script>

这里注意 selectItems.y.text 取到的是字符串类型,selectItems.y.value取到的是值类型,一般来说,取字符串,方便传递。

 

(三)打开你的浏览器,看看成果吧!

 

 

上一篇: 如何正确运用异步编程技术 下一篇: 没有下一篇了!
发表评论
用户名: 匿名