我正在尝试实现一个 jQuery 滑块,您可以在其中将项目拖放到滑块上。
掉落物品有效。但是,句柄会跳转到放置点的位置。这是一个小提琴:
$(function () {
//the draggable object
$("#dragobject").draggable();
//Prepare the slider
var range = 100,
sliderDiv = $("#slider");
// Activate the UI slider
sliderDiv.slider({
min: 0,
max: range,
});
// Number of tick marks on slider
var position = sliderDiv.position(),
sliderWidth = sliderDiv.width(),
minX = position.left,
maxX = minX + sliderWidth,
tickSize = sliderWidth / range;
//Set slider as droppable
sliderDiv.droppable({
//on drop
drop: function (e, ui) {
//If within the slider's width, follow it along
if (e.pageX >= minX && e.pageX <= maxX) {
var val = Math.round((e.pageX - minX) / tickSize);
sliderDiv.slider("value", val);
alert("My position is : " + val + "% !!");
//do ajax update here to set the position
/*$.ajax({
type: "POST",
url: url,
data: val,
success: function () {
//congrats
},
dataType: dataType
});*/
}
}
});
});
我希望把手留在原来的位置。