我拥有的：
我有一个可拖动的div，还原参数设置为“无效”。
我需要的：
当恢复发生时，我想触发CSS更改为另一个元素。
问题：
“还原”是参数而不是一个事件，所以在恢复发生时我遇到很大的困难才能触发所需的CSS更改。
我的代码：
$('#peg_icon').draggable({
revert: 'invalid',scroll: false,stack: "#peg_icon",drag: function(event,ui) {
$('#peg_icon').css('background-image','url(images/peg-icon-when-dragged.png)');
}
});
我试过的
我没有成功尝试使用“还原”作为事件：
revert: function(event,ui) {
$('#peg_icon').css('background-image','url(images/peg-icon-default.png)');
},
我也没有成功地尝试让恢复参数来执行此功能：
function(socketObj)
{
//if false then no socket object drop occurred.
if(socketObj === false)
{
//revert the peg by returning true
$('#peg_icon').css('background-image','url(images/peg-icon-default.png)');
return true;
}
else
{
//return false so that the peg does not revert
return false;
}
}
语境：
我拖动一个div，当拖动时，背景图像发生变化，当拖动恢复时，背景图像将恢复到原始状态。
我的问题：
当拖动时发生恢复时，如何触发CSS更改为另一个元素？
解决方法@H_403_36@
事实证明，还原可以接受一种方法。看到这个完整的例子：
http://jsfiddle.net/mori57/Xpscw/
特别：
$(function() {
$("#ducky").draggable({
revert: function(is_valid_drop){
console.log("is_valid_drop = " + is_valid_drop);
// when you're done,you need to remove the "dragging" class
// and yes,I'm sure this can be refactored better,but I'm
// out of time for today! :)
if(!is_valid_drop){
console.log("revert triggered");
$(".pond").addClass("green");
$(this).removeClass("inmotion");
return true;
} else {
$(".pond").removeClass("green");
$(this).removeClass("inmotion");
}
},drag: function(){
// as you drag,add your "dragging" class,like so:
$(this).addClass("inmotion");
}
});
$("#boat").droppable({
drop: function( event,ui ) {
$(this)
.addClass("ui-state-highlight");
}
});
});
希望这有帮助…我猜测，无论您尝试修改是什么问题，而不是使用函数调用恢复的尝试。再看看你试图设置什么CSS，看看你的问题是否在那里。
http://jsfiddle.net/mori57/Xpscw/
特别：
$(function() {
$("#ducky").draggable({
revert: function(is_valid_drop){
console.log("is_valid_drop = " + is_valid_drop);
// when you're done,you need to remove the "dragging" class
// and yes,I'm sure this can be refactored better,but I'm
// out of time for today! :)
if(!is_valid_drop){
console.log("revert triggered");
$(".pond").addClass("green");
$(this).removeClass("inmotion");
return true;
} else {
$(".pond").removeClass("green");
$(this).removeClass("inmotion");
}
},drag: function(){
// as you drag,add your "dragging" class,like so:
$(this).addClass("inmotion");
}
});
$("#boat").droppable({
drop: function( event,ui ) {
$(this)
.addClass("ui-state-highlight");
}
});
});
希望这有帮助…我猜测，无论您尝试修改是什么问题，而不是使用函数调用恢复的尝试。再看看你试图设置什么CSS，看看你的问题是否在那里。
