1

ツールチップをfalseに設定して、instantsearch.jsのAlgoliaのrangesliderを使用しています。スライダーの最大値（スライダーの右側の値）（例：2,000）が表示されている場合、（例：2,000+）（「+」付き）として表示したい。

次のようにjqueryで値にアクセス/リセットしようとしました:

var $sliderMax = $('#my_slider_identifier .ais-range-slider--value').last();

そして、変数のハンドルを取得することに成功しましたが、カスタム ウィジェットの render() 関数から最大値をリセットしようとすると (そのため、新しい結果セットが入るたびに更新されます)、同等の値を使用して$sliderMax.text('2,000' + '+')も何も起こりません -私の呼び出し後にDOMが書き直されているためだと思います..

rangeSlider が最大値 (例: 2000) を表示している場合、末尾に「+」を付ける推奨方法はありますか?

編集： より多くの背景を説明するために：0〜10,000 +の範囲の値がありますが、データの大部分は0〜2000の範囲にあるため、データを切り捨てて、2000を超える場合は表示されます2000年として。

また、偶然にも奇妙なことに、ハックとして、setTimeout を 0 ミリ秒 (はい、これにはスタックオーバーフローがあります) を使用し、JQuery の選択をやり直すと、DOM に書き込むことができることがわかりました。

setTimeout(function(){
    $('#index_price_eur_day_i .ais-range-slider--value').last()
        .text(MAX_PRICE_SLIDER + '+');}, 0);

より効率的な解決策を見つけたいと思います。

4

1 に答える 1

3

Algolia の Tim Carry から聞いたところ、:afterこれを修正するために CSS の疑似要素を試すよう提案されました。

確かに、私はこの CSS を追加し、常に + を追加します -- 残念ながら、スライダーが最大値にない場合でも:/

#my_slider_identifier .ais-range-slider--value:last-of-type::after { 
    content: "+";
}

したがって、これは完璧な解決策ではありませんが、「十分」である可能性があり、jquery を使用するほど醜く/非効率的ではありません。誰かがより良い解決策を持っている場合は、投稿してください！

于 2016-01-27T18:56:47.570 に答える