dojo 如何在dijit/form/HorizontalSlider上检测onMoveStart和onMoveStop?

mmvthczy  于 2023-02-10  发布在  Dojo
关注(0)|答案(1)|浏览(309)

我使用的是dojo 1.10.4,我需要在dijit/form/HorizontalSlider中的"slider element inside"上检测事件onMouseStartonMouseStop
目前,我正在尝试检测对象_movable(它是一个dojo/dnd/Moveable),但没有成功,出现错误:

Moveable.js:11 Uncaught TypeError: Cannot read property 'style' of undefined
  • 如何在HorizontalSlider上收听onMouseStartonMouseStop
  • 或者,你知道什么更好的方法来检测用户何时开始结束滑动。

示例:https://jsfiddle.net/9uo1doan/
x一个一个一个一个x一个一个二个x
参考:https://dojotoolkit.org/reference-guide/1.10/dojo/dnd/Moveable.html
我也尝试过,但没有成功:

on(slider._movable, 'moveStart', function(e){});
t40tm48m

t40tm48m1#

我可以使用dojo/aspect解决这个问题。
基本上,我找到的解决方案是在dojo/dnd/Moveable上执行方法onMoveStart之后运行我的函数。
我仍然有兴趣了解为什么使用事件侦听器的更传统的方法不起作用。
实时演示:https://jsfiddle.net/8z6sm14j/

require([
  "dojo/dom",
  "dojo/on",
  "dojo/aspect",
  "dijit/form/HorizontalSlider",
  "dijit/form/TextBox",
  "dojo/domReady!"
], function(dom, on, aspect, HorizontalSlider, TextBox) {
  debugger
  var slider = new HorizontalSlider({
    name: "slider",
    value: 5,
    minimum: -10,
    maximum: 10,
    intermediateChanges: true,
    style: "width:300px;",
    onChange: function(value) {
      dom.byId("sliderValue").value = value;
    }
  }, "slider");
    var result = document.getElementById('result');

  aspect.after(slider._movable, 'onMoveStart', function(event) {
    console.log('onMoveStart');
    result.innerHTML = 'onMoveStart';
  });

  aspect.after(slider._movable, 'onMoveStop', function(event) {
    console.log('onMoveStop');
    result.innerHTML = 'onMoveStop';
  });

});
<div id="slider"></div>
<input type="text" id="sliderValue" data-dojo-type="dijit/form/TextBox" />
<div id="result"></div>

仅供参考,我在研究了this module之后能够想出这个解决方案。

相关问题