在隐藏字段中获取价格滑块的值？

Question

我想用价格滑块的值更新隐藏字段的值。我使用一些 jQuery 来完成这个。

下面的代码有效，但我需要 setTimeout 才能获得正确的值。如果没有 setTimeout，它会使用前一个滑块值而不是最新滑块值更新隐藏字段值。

因此我想知道是否也有像'on slide stop'这样的check/event，所以只有当滑块按钮不再处于活动状态时才执行代码。有什么想法吗？

在我的代码下面：

<html>
<head>
<script>
        (function( $ ) {
            $(document).ready(function() {

                var tw_total = $('.btQuoteTotalCalc').text();
                $("#calculated_total").attr("value",tw_total);

                $('.btQuoteSlider').on('slide', function(event, ui) {
                    setTimeout(function() {
                        var tw_total = $('.btQuoteTotalCalc').text();
                        $("#calculated_total").attr("value",tw_total);
                    }, 500);
                });

            });
        }(jQuery));
</script>
</head>
<body>
     <div class="btQuoteSlider"></div>
     <div class="btQuoteTotalCalc">Slider total</div>

     <input type="hidden" name="calculated_total" value="" id="calculated_total">
</body>
</html>

Answer 1

我认为您正在为滑块元素使用 jQuery UI 库，如果是这样，则不需要 setTimeout 函数。如果事件未取消，事件本身会给出句柄将移动到的值。

试试这个 -

$('.btQuoteSlider').on('slide', function(event, ui) {
    $("#calculated_total").attr("value", ui.value);
});

参考：https://api.jqueryui.com/slider/#event-slide

在隐藏字段中获取价格滑块的值？

Get value of price slider in a hidden field?

jquery

slider

jquery-events