检测滑块更改

Question

我有

7个滑块，当我的一个滑块被移动时，我试图显示save按钮。

HTML

 <div class="schedule-sliders device-schedule-sliders time-range" ng-show="device.acl_mode == 3"> .... </div>

我已经尝试了

正如您所见，device-schedule-sliders就在那里。

    console.log('A');
    $(".device-schedule-sliders").on('click',function(){
        console.log('clicked');
        alert('RUN');
        $scope.buttonShow.acl = true;
    });
    console.log('B');

我无法运行我的功能。

如果我在控制台上尝试了它

console.log($(".device-schedule-sliders"));

我得到了

[prevObject: n.fn.init(1), context: document, selector: ".device-schedule-sliders"]

如何继续进行调试？

  

更新了

感谢 @Prera​​k Sola ，我更新了我的代码并重试了我的滑块ID

id="device-schedule-sliders"

<div id="device-schedule-sliders" class="schedule-sliders time-range" ng-show="device.acl_mode == 3">

....

和JS

 $("#device-schedule-sliders" ).on( "slidechange", function( event, ui ) {
        //Toggle your save button
        console.log('clicked');
        alert('RUN');
        $scope.buttonShow.acl = true;
    });

结果

仍然一样，我无法让我的警报fn运行。

Answer 1

您可以在滑块上收听change事件。你可以这样做：

$( ".slider-range" ).on( "slidechange", function( event, ui ) {
    //Toggle your save button
});

参考：docs

这是一个适用于id。

的工作fiddle