我想使用 jquery ui 制作一个带有两个 handle 的 slider ,以保持它们之间的最小空间。如果左 handle 试图与右 handle 交叉,则应插入右 handle 。反之亦然。这是一个示例(不要介意重叠,这并不重要):
只要移动缓慢,它就可以工作,但如果鼠标移动太快,则在“插入”场景中会失败。我认为在“ slider ”事件中设置 slider 值可能有问题。
最佳答案
这有效。我从 $.ui.slider.prototype._slide
复制了代码,并删除了检查左 handle 是否大于右 handle 的部分。现在运行良好。
$.ui.slider.prototype._slide = function ( event, index, newVal ) {
var otherVal,
newValues,
allowed;
if ( this.options.values && this.options.values.length ) {
otherVal = this.values( index ? 0 : 1 );
if ( newVal !== this.values( index ) ) {
newValues = this.values();
newValues[ index ] = newVal;
// A slide can be canceled by returning false from the slide callback
allowed = this._trigger( "slide", event, {
handle: this.handles[ index ],
value: newVal,
values: newValues
} );
otherVal = this.values( index ? 0 : 1 );
if ( allowed !== false ) {
this.values( index, newVal, true );
}
}
} else {
if ( newVal !== this.value() ) {
// A slide can be canceled by returning false from the slide callback
allowed = this._trigger( "slide", event, {
handle: this.handles[ index ],
value: newVal
} );
if ( allowed !== false ) {
this.value( newVal );
}
}
}
}
关于javascript - 如何制作一个带有两个彼此为 "push"的句柄的 jquery ui slider ?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11585046/