Question

我有一个jQuery滑块（实际上是一个自定义扩展），它配备了slide事件的处理程序，当滑块被交互操作时，这个处理程序被正确调用，但是当我运行

$("#slider").trigger("slide");

此命令运行时没有错误，但slide处理程序不会被调用。

为什么会这样？

我是否需要传递一个不同的参数来触发才能调用slide处理程序？

编辑：改变帖子的标题，以更接近地反映问题的动机。

Answer 1

工作演示：http://jsfiddle.net/fLnmN/ 或 http://jsfiddle.net/F5ZCK/

像我在演示中使用的那样使用.bind。您可以使用.on，如下所示：http://jsfiddle.net/u82Y5/

这里有一些非常有用的帖子：Trigger a jQuery UI slider event

这应符合您的需求，:)

<强>码

$('.slider').slider().bind({
    change: function() {
       alert('change triggered');
    }
});

$('.slider').trigger('change');

或

$('.slider').slider().on({ change: function() { alert('change triggered'); }, slidechange: function() { alert('slide trigger'); } }); $('.slider').trigger('change'); $('.slider').trigger('slidechange');

Answer 2

trigger('slide')不起作用的原因是因为当您设置slide回调时，滑块会不使用DOM元素注册幻灯片事件。相反，它将通用鼠标事件委托给DOM元素，然后在内部将它们转换为回调函数。

不幸的是，这使您无法解决该API问题。 Tats_innit的答案将事件直接绑定到DOM元素，但它们不与滑块API绑定。你必须在这些处理函数中调用你的回调函数。

如果您可以访问回调，可以直接调用它们，如下所示：

$('#slider').slider({
  'slide': onSlide
}).on('slide', onSlide);

如果您希望内联定义回调函数，可以按如下方式检索它们：

$('#slider').slider({
  'slide': function(event, ui) { /* ... */ },
}).on('slide', function() {
  $(this).slider('option', 'slide').apply(this, arguments);
});

毋庸置疑，这是多余的，但同样，这是一种解决方法。

另一方面，请记住，触发事件会单独跳过其他事件，这些事件将来自用户时会连续调用。例如，触发stop事件会错过用户在调整滑块时生成的slide事件。您可以考虑通过创建代表您发送多个事件的自定义事件来“证明”外部事件绑定（例如，$('#slider').trigger('setvalue')）。

Answer 3

可以直接调用幻灯片回调，但是您应该传递事件（或null）和具有值的对象（如果它在calback中使用）：

var $slider = $("#slider");
$slider.slider('option', 'slide').call($slider, null, {value:1});

为什么不$（“＃slider”）。触发器（“幻灯片”）导致调用滑块处理程序？

3 个答案: