2

ドロップダウン メニュー {毎日、毎週、毎月} で動作する範囲スライダーを作成したいと考えています。

毎日の歩数を選択すると、7 に変更され、minDate が maxDate に変更されると、今日の日付が 7 になります。毎週のステップを選択すると、4(7-7-7-7=30) に変更され、minDate が (maxDate)today date-30 に変更されます。毎月のステップを選択すると、12 (12 か月 = 365 日) に変更され、minDate が (maxDate)today date-365 に変更されます。

そして両方のマウスポインタがmaxDateを指していました

var maxdate1 = new Date(),
    minDate1 = removeDays(new Date(), -7);
alert(minDate1);

$( "#slider" )
  .slider({range: true,
      step:  1,
      animate:true,
      value: maxDate1,
      values [minDate1, maxDate1],
      max: Math.floor((maxDate1.getTime() - minDate1.getTime()) / 86400000),

      slide: function(event, ui) {

        var date = new Date(minDate1.getTime());
        date.setDate(date.getDate() + ui.values[0]);

        $('#startDate').val($.datepicker.formatDate('mm/dd/yy', date));
        $('#from').val($.datepicker.formatDate('M d, yy', date));          

        date = new Date(minDate1.getTime());

        date.setDate(date.getDate() + ui.values[1]);

        $('#endDate').val($.datepicker.formatDate('mm/dd/yy', date));
        $('#to').val($.datepicker.formatDate('M d, yy', date));
      }
  });
4

1 に答える 1

0

私の理解が正しければ、初期化後にスライダーのパラメーター (ステップ、最小、最大など) を変更できるようにする必要があります。このようなものが動作するはずです:

$('#dropdown').change(function() {
    switch ($(this).val()) {
    case 'daily':
        $('#slider').slider('option', 'step', 1);
        break;
    case 'weekly':
        $('#slider').slider('option', 'step', 7);
        break;
    case 'monthly':
        $('#slider').slider('option', 'step', 30);
        break;
    }
});
于 2013-09-12T20:07:34.393 に答える