-1

JQuery レンジスライダーを使用しています。

HTMLコードで設定した最小値を6、最大値を60にしたい...

<input type="range" value="18" min="6" max="60" step="6" >

ステップ サイズは、36 になるまで 6 ずつ増加する必要があります。スライダーが 36 に達すると、ステップ サイズは 12 増加します (そうあるべきです)... その後、48、次に 60 にスナップする必要がありますが、代わりに 42 に増加し、次に54と66！

したがって、6,12,18,24,30,36,48,60に行く代わりに

行きそうです..

6,12,18,24,30,36,42,54,66

指示されている場所でステップサイズが増加し、正しい金額が表示されるようにするために私ができることを誰かが知っていますか?

同様の方法で動作するこの Codepenを確認してください

ありがとう</p>

4

2 に答える 2

0

そのためには jquery を使用する必要があります。step属性を要素に渡していますinput。これは、値がステップ量だけ増加することを意味します。

値が 36 より大きい場合は、最初に属性を削除する必要があります。次に、関数を使用して属性attrを追加し、 aを 12 に設定します。 stepvalue

if ($(input[type="range").val() >= 36) {
  $(this).removeAttr('step')
         .attr('step', 12);
}

注: これにより、すべての入力範囲フィールドの属性が変更されます。1 つだけ変更する場合は、入力フィールドに ID を追加する必要があります。

次に、IDセレクターを使用します

$('#range1')
于 2015-03-10T16:33:21.413 に答える