0

私は単純なjavascriptを持っています:

<a href="javascript:;" onclick="max_range(300)">Max 300</a>
<a href="javascript:;" onclick="max_range(1000)">Max 1000</a>
<div id="price"></div>

およびJavaScript関数：

function max_range(max) {
   var price = document.getElementById('price');

    noUiSlider.create(price, {
        connect: true,
        behaviour: 'tap',
        start: [ 0, max ],
        step: 100,
        range: {
            'min': 0,
            'max':  max,
        }
    });
}
// load default
max_range(500);

イベントonlickをキャッチすると。このバグを表示"Error: Slider was already initialized."

修正方法は？

4

1 に答える 1

1

onclick="max_range(1000)"noUiSlider の新しいインスタンスを作成しようとしているたびに。初めて問題なく動作しますが、送信時刻をクリックするとエラーが発生しますError: Slider was already initialized.

必要なのは、ユーザーがリンクをクリックしたときに範囲 (最小、最大) を更新することだけです。

var price = document.getElementById('price');

noUiSlider.create(price, {
    connect: true,
    behaviour: 'tap',
    start: [ 0, 500],
    step: 100,
    range: {
        'min': 0,
        'max':  500, // your default.
    }
});

function max_range(max) {
    // Update range
    price.noUiSlider.updateOptions({
        range: {
            'min': 0,
            'max': max
        }
    });
    // Set the upper handle,
    // don't change the lower one.
    price.noUiSlider.set([null, max]);
}

updateOptions メソッドを使用してオプションを更新できます。詳細については、このドキュメントを参照してください。

于 2016-03-04T07:37:05.560 に答える