0

当我尝试隐藏包含用户选择的日期的输入时:

style = "display:none"

选择器不再显示。我绝对需要隐藏此输入,因为用户唯一必须看到的是他单击以打开选择器的按钮。

HTML:

<input type="button" value="Répercuter" class="button" id="btnRepercute"/>
<input type="text" name="dateMultiCalendar_1" id="dateMultiCalendar_1" class="dateMultiCalendar_1"/>

JS:

$('#dateMultiCalendar_1').multiDatesPicker($.datepicker.regional[ "fr" ]);
$('#btnRepercute').click(function() {
$("#dateMultiCalendar_1").datepicker( "destroy" );
$('#dateMultiCalendar_1').multiDatesPicker
({

           // $.datepicker.regional[ "fr" ]
           //beforeShowDay: $.datepicker.noWeekends
        beforeShowDay: function (date) {
         var today = new Date();
           if (date.getDay() === 1 || date.getDay() === 2 || date.getDay() === 3
           || date.getDay() === 4 || date.getDay() === 5)

           {
            if (date.getMonth() === today.getMonth())
                {
                    return [true, ''];
                }
           }
        return [false, ''];
        }

});
 $('#dateMultiCalendar_1').focus();
});

我刚刚注意到,当我单击按钮显示选择器时,日历总是显示在输入下方,而不是按钮下方。也许是当我隐藏输入时,日历不再出现的原因。

4

2 回答 2

1

您的代码不起作用,因为您无法将焦点放在未显示的字段上。但是,您可以使用 .js 从 javascript 显示日期选择器datepicker('show')。(并不是说在这种情况下我们使用 datepicker 而不是 multiDatesPicker)

试试这个 :

//Attach the date picker to you text field
$('#dateMultiCalendar_1').multiDatesPicker({
           beforeShowDay: function (date) {
                var today = new Date();
                if (date.getDay() >= 1 && date.getDay() <= 5){
                   if (date.getMonth() === today.getMonth(){
                      return [true, ''];
                   }
                }
                return [false, ''];
           }
 });

//Make the button display the date picker on cick
$('#btnRepercute').click(function() {
         $('#dateMultiCalendar_1').datepicker('show');
});
于 2013-06-13T11:30:10.917 回答
0

[更新]

$('#dateMultiCalendar_1').hide();
$('#dateMultiCalendar_1').datepicker({
           // $.datepicker.regional[ "fr" ]
           //beforeShowDay: $.datepicker.noWeekends
    beforeShowDay: function (date) {
    var today = new Date();
    if (date.getDay() >= 1 && date.getDay() <= 5)
    {
       if (date.getMonth() === today.getMonth())
          {
              return [true, ''];
          }
       }
       return [false, ''];
     },
  showOn: "button"
});
$('.ui-datepicker-trigger').text('whatever');

抱歉,我无法及时回复您,但您似乎已经得到了答案,无论如何,这里将是我的:

$('#dateMultiCalendar_1').hide();
$('#dateMultiCalendar_1').multiDatesPicker({
    beforeShowDay: function (date) {
        if (date.getDay() >= 1 && date.getDay() <= 5)
            return [true, ''];
        else
            return [false, ''];
     }
});

$('#btnRepercute').click(function(){
    $('#dateMultiCalendar_1').toggle('show');
});

这是小提琴:点击我

于 2013-06-13T10:29:28.167 回答