jQuery 幻灯片停止触发 Chrome 61.0.3163.100 中的事件

Posted 2023-05-08

【中文标题】jQuery 幻灯片停止触发 Chrome 61.0.3163.100 中的事件

【英文标题】：jQuery slide stopped triggering events in Chrome 61.0.3163.100

【发布时间】：2018-03-20 09:24:49

【问题描述】：

三天前，这用于在移动滑块时打印控制台输出（在 Firefox 中每晚）：

$(document).ready(function() 
  $('.slider').slider(
    slide: function() 
      console.log('slide');
    ,
    change: function() 
      console.log('change');
    
  );
);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
<input type="range" min="0" max="10" value="0" class="slider" id="slider0" name="slider0"/>

今天当我尝试它时（在 Chrome 61.0 中），它不会将任何内容记录到控制台。我错过了什么，还是某种更新？

【参考方案1】：

它不起作用的原因是<input/> 是它不打算用作jQuery UI 的滑块。这适用于常规输入滑块，并且没有 jQuery UI：

$(function() 
  var prevVal = ;
  $('.slider').on('change mousemove', function () 
    var slider = $(this);
    if (slider.val() != (prevVal[slider.attr('id')] || 0)) 
      prevVal[slider.attr('id')] = slider.val();
      slider.trigger('slide');
    
  );
  $('.slider').on('slide', function () 
    console.log('Sliding:', $(this).val());
  );
);

【参考方案2】：

你可以这样写滑块

$("#installs").slider(min: 0,max: 500,step: 10,slide: function (event, ui)console.log("slide");,change:function(event,uiconsole.log("updatge"););