滑块在较新版本的 jquery/ui 中无法正常工作

Question

我有以下 2 个小提琴：

http://jsfiddle.net/uxp56hL0/ 这个正在使用 jquery 3.6.0 和 jquery ui 1.13.1

http://jsfiddle.net/34oqnmca/2/ 这个正在使用 jquery 1.6.2 和 jquery ui 1.8.4

第二个工作正常，第一个（然后是较新的版本）没有。我收到错误： Uncaught TypeError: raw is undefined

新版本中是否存在导致此行为的重大变化？我试图寻找 1.6 和 3.6 之间的一些变化（我承认这是巨大的飞跃）但没有运气......

Answer 1

我怀疑您的 CDN 有一些奇怪的库，或者它们没有正确链接。我对 Fiddle 做了一些小改动，它工作正常。

示例：https://jsfiddle.net/Twisty/eobnxvza/8/

JavaScript

$(function() {
  var myarray = ['2022-01', '2022-02', '2022-03', '2022-04', '2022-05', '2022-06', '2022-07', '2022-08', '2022-09', '2022-10', '2022-11', '2022-12']

  $("#slider").slider({
    range: true,
    min: 0,
    max: 11,
    step: 1,
    values: [4, 5],
    slide: function(event, ui) {
      var delay = function() {
        var handleIndex = ui.handleIndex;
        var label = handleIndex == 0 ? '#min' : '#max';
        $(label).html(myarray[ui.value]).position({
          my: 'center top',
          at: 'center bottom',
          of: ui.handle,
          offset: "0, 10"
        });
      };

      // wait for the ui.handle to set its position
      setTimeout(delay, 5);
    }
  });

  console.log('debug: ' + $('#slider').slider('values', 0));
  $('#min').html(myarray[$('#slider').slider('values', 0)]).position({
    my: 'center top',
    at: 'center bottom',
    of: $('#slider .ui-slider-handle:eq(0)'),
    offset: "0, 10"
  });

  console.log('debug: ' + $('#slider').slider('values', 1));
  $('#max').html(myarray[$('#slider').slider('values', 1)]).position({
    my: 'center top',
    at: 'center bottom',
    of: $('#slider .ui-slider-handle:eq(1)'),
    offset: "0, 10"
  });
});

我包装了它并调整了句柄的引用方式。当运行第 35 或 36 行出现 raw 错误。我解决了这个问题，但仍然无法从 CSS 正确加载。所以我把它切换到以下资源：

<link rel="stylesheet" href="//code.jquery.com/ui/1.13.1/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/jquery-3.6.0.js"></script>
<script src="https://code.jquery.com/ui/1.13.1/jquery-ui.js"></script>

现在可以正常使用了。

滑块在较新版本的 jquery/ui 中无法正常工作

slider not working correctly in newer versions of jquery/ui

jquery

jquery-ui