关于这个问题,我只看到几个变体问了几个其他地方,特别是 here和 here .
基本上,我有一个西洋跳棋棋盘,棋盘上的每个方 block 都是可放置的,每个棋子都是可拖动的。每个方 block 一次只能有一个棋子,我试图根据方 block 上是否有棋子来切换启用/禁用方法。
这是我目前所获得内容的链接:http://jsbin.com/ayalaz , 下面是最相关的代码。
function handleDrop(e, ui) {
var tileNumber = $(this).data('tile');
// Make the gamepiece snap into the tile
ui.draggable
.data({ // WHAT IF PIECE IS SET BACK DOWN IN SAME TILE... CHECK FOR IT!
'preRow': ui.draggable.data('curRow'),
'preCol': ui.draggable.data('curCol'),
'curRow': $(this).data('row'),
'curCol': $(this).data('col')
});
$(this).append($(ui.draggable));
ui.draggable
.position({
of: $(this),
my: 'left top',
at: 'left top'
});
$(this).droppable('disable');
//console.log("Gamepiece set down at: (" + $(this).data('row') + "," + $(this).data('col')+ ")");
}
function handleOut(e, ui) {
// HOW TO TOGGLE DROPPABLE??
$(this).droppable('enable');
}
有什么建议吗?
提前致谢! 杰里米
最佳答案
看起来您在第一次放置事件后成功地禁用了图 block 上的可放置。您的问题是您最初没有在初始占用的图 block 集上将 droppable 设置为 disabled。
在你创建了你的游戏板和棋子之后,假设我的 CSS 选择器准确地反射(reflect)了你的结构,这应该可以完成:
$('div.gamePiece').parent().droppable("option", "disabled", true);
请注意,这与在初始选项中更改可转换性的语法不同。来自jQuery UI droppable documentation :
//initialize
$( ".selector" ).droppable({ disabled: true });
//setter
$( ".selector" ).droppable( "option", "disabled", true );
编辑
看来我错了 $(this).droppable('disable');
和 $(this).droppable('enable');
jquery- ui 确实具有用于启用和禁用的别名函数。
enable: function() {
return this._setOption( "disabled", false );
},
disable: function() {
return this._setOption( "disabled", true );
},
关于jquery-ui - 使 jQuery UI 可拖放一次只接受一个可拖动,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10338362/