基础范围滑块无法施加限制

时间:2015-05-14 18:19:40

标签: javascript jquery slider zurb-foundation

我目前有一个可以有多个范围滑块的屏幕。 每个滑块的总范围为0到滑块组合的最大值 可以有。例如start: 0; end: 20;

在我的应用程序中,我想为用户可以通过滑块选择的值设置一些限制。因此,虽然滑块可视范围为每个单独的滑块提供0到20的完整外观,但用户只能选择2 - 10 然后我确认所有滑块的总和在最高20的可接受范围内。

目前我有一些像这样的代码似乎无能为力

self.$qtyForm.on('change.fndtn.slider', '.range-slider', function (e) {
    var $rng = $(this),
        qty = parseInt($rng.data('slider'), 10);

    if (qty > maxChoiceQty) {
        $rng.foundation('slider', 'set_value', maxChoiceQty);
    }

    if (qty < minChoiceQty) {
        $rng.foundation('slider', 'set_value', minChoiceQty);
    }
});

我还注意到,只要触摸滑块旋钮,就会触发更改事件。 因此,当用户改变范围时,这实际上是发射50次 这看起来并不正确。以任何方式限制或使用其他事件

1 个答案:

答案 0 :(得分:0)

jQuery一旦加载就在内部存储数据属性。替换此行:

qty = parseInt($rng.data('slider'), 10)

用这个:

qty = $($rng).attr('data-slider')

你应该得到当前的滑块值。