3

基本的に、私が行っているのは、一連の日付用のシングルハンドルのjQueryUIスライダーです。選択される日付範囲は常に2週間です。私がやりたいのは、2週間先の2週間の範囲（ハンドルが存在する日付）の開始日からの範囲（範囲が機能している必要はありません-表示されるだけです）を表示することです。この範囲は固定されています。

たとえば、ハンドルが1月1日である場合、範囲を1月14日まで拡張したいと思います。スライダーが1月3日に移動した場合、それと一緒に移動する範囲を16日に終了させたいと思います。

これが可能かどうか誰かが知っていますか？

4

1 に答える 1

4

jQuery UIスライダーはそれを念頭に置いて設計されていませんが、スライダーのイベントslideとstopイベントを自分で処理して、範囲の値を好きなようにリセットできます。

http://docs.jquery.com/UI/Slider

これは決してすべての要件に対応しているわけではありませんが、それは始まりです。

$('#myslider').slider({
    min:1,
    max:31,
    values:[1, 14],
    step:1,
    range:true,
    slide:function(event, ui) {
        var s = $(this);
        var values = s.slider('option', 'values');

        if(ui.handle.nextElementSibling == null) // max slider
            values[0] = values[1] - 14;
        else // min slider
            values[1] = values[0] + 14;

        s.slider('option', 'values', values);
    },
    stop:function() {
        var s = $(this);
        var min = s.slider('option', 'min'),
            max = s.slider('option', 'max'),
            values = s.slider('option', 'values');

        if(values[0] <= min)
            values = [min, min + 14];
        if(values[1] >= max)
            values = [max - 14, max];

        s.slider('option', 'values', values);
    }
});
于 2011-11-12T15:21:05.643 に答える