使用版本mobiscroll.custom-2.16.1.min.js具体组件可以去官网,
http://download.mobiscroll.com/
下载,不过需要收费,有破解版方法可以看下
http://blog.csdn.net/cdnight/article/details/49306957
这篇文章,写的太棒了。
引入js和css
<span style="font-family: Arial, Helvetica, sans-serif;"><script src="mobiscroll/js/mobiscroll.custom-2.16.1.min.js" type="text/javascript"></script></span>
<link href="mobiscroll/css/mobiscroll.custom-2.16.1.min.css" rel="stylesheet" type="text/css" />
日期输入文本框:
<input class="riqi-input" type="text" name="startTime" value="${startTime}" id="starttime">
遇到问题:文本框路径传参传入一个日期2016-04-15格式,此时点击文本框初始化组件选择时,弹出框层的日期是从参数opt.
startYear的值开始的。
分析的结论是:当文本框中有初始化值时可能会对参数中的defaultValue有影响。
解决办法:这里是先加载mobiscroll.js控件,先把功能加载到文本框上,然后在使用jquery把初始化的值赋值给文本框
代码如下:
<input class="riqi-input" type="text" name="startTime" value="" id="starttime">
初始化js
$(function(){
var currYear = (new Date()).getFullYear();
var opt={};
opt.date = {preset : 'date'};
opt.datetime = {preset : 'datetime'};
opt.time = {preset : 'time'};
opt.default = {
theme: 'android-holo-light', //皮肤样式
display: 'modal', //显示方式
mode: 'scroller', //日期选择模式
dateFormat: 'yyyy-mm-dd',
lang: 'zh',
// showNow: true,
// nowText: "今天",
startYear: currYear - 10, //开始年份
endYear: currYear + 10 //结束年份
};
$("#starttime").mobiscroll($.extend(opt['date'], opt['default']));
<span style="color:#ff0000;">initDateCompontValue();</span>
});
function initDateCompontValue(){
var starttime='${startTime}';
$("#starttime").val(starttime);
}