为什么我的jQuery日期选择器UI插件不会在年份字段中显示向上/向下箭头

时间:2013-04-11 19:38:06

标签: jquery css jquery-ui jquery-plugins

根据problematic example,我似乎无法使用向上和向下箭头来选择早于2001年或晚于2021年的日期。

Education Record
    did you complete high school? * --> Yes
    clicking Graduation Date *  
        clicking 2013 down arrow

example

任何想法导致了什么?在Windows 7和Firefox中的IE10中根本没有显示滚动箭头显示滚动箭头但是在2001年之前或2021之后无法滚动。解决方法是选择最小或最大日期并再次单击箭头在年之前或之后展示。

3 个答案:

答案 0 :(得分:9)

试试这个 - jsFiddle

$(function () {
 $("#datepicker").datepicker({
     changeMonth: true,
     changeYear: true,
     yearRange: "-120:+10", // magic!
     dateFormat: 'mm/yy',
     onClose: function (dateText, inst) {
         var month = $("#ui-datepicker-div .ui-datepicker-month :selected").val();
         var year = $("#ui-datepicker-div .ui-datepicker-year :selected").val();
         $(this).datepicker('setDate', new Date(year, month, 1));
     }
  });
});

API Documentation for yearRange

答案 1 :(得分:2)

正如我在你的截图中看到的那样,你正在使用IE10,它有一种怪异的风格。您选择的下拉列表可以在Chrome,FF,Safari等良好的浏览器中正常运行...... 我很确定你是否为具有
的选择元素设置了一个固定的高度 .ui-datepicker-year类,例如height:150px;并添加overflow:auto;希望这有帮助

答案 2 :(得分:2)

在jQuery-UI中,您可以轻松指定年份范围和默认日期。

    $( "#specific_birthdate" ).datepicker( {
        yearRange : "1950:2011",
        changeYear : true,
        defaultDate : new Date(1970, 0, 1, 0, 0, 0, 0)
    } );