2

这里我有一堆 div

<div id="computers">
    <div class="system" data-price="299">div1 -  299</div>
    <div class="system" data-price="599">div2 -  599</div>
    <div class="system" data-price="1099">div3 -  1099</div>
</div>

我正在使用 jQuery UI 滑块并尝试根据滑块的最小值和最大值显示/隐藏“div.system”。

我用过下面的脚本

  $(function() {
        $('#slider-container').slider({
            range: true,
            min: 299,
            max: 1099,
            values: [ 299, 1099 ],
            slide: function(event, ui) {
                $( "#amount" ).val( "$" + ui.values[ 0 ] + " - $" + ui.values[ 1 ] );
                var mi = ui.values[ 0 ];
                var mx = ui.values[ 1 ];
                filterSystem(mi, mx);
            }
        });
      $( "#amount" ).val( "$" + $( "#slider-range" ).slider( "values", 0 ) +
      " - $" + $( "#slider-range" ).slider( "values", 1 ) );
  });

function filterSystem(minPrice, maxPrice) {
    $("#computers div.system").hide().filter(function() {
        var price = parseInt($(this).data("price"), 10);
        return price >= minPrice && price <= maxPrice;
    }).show();
}

我已经做到了，没有任何错误。

但在这里我想切换类（添加/删除类）而不是隐藏/显示“div.system”。

我该怎么做，我试过了，但我没有

谁能帮我？这是演示小提琴

提前致谢

4

0 回答 0