如果我了解您要查找的内容,那么您的选择器将是:$('.cell.active')
$('.cell.active').droppable({
drop: function(event, ui) {
var pieceValue = ui.helper.data('value');
var toBoard = $(this).data('square');
var splitResult = toBoard.split(',');
board[splitResult[0]][splitResult[1]] = pieceValue;
$(this).append(ui.draggable);
}
});
在 jsFiddle 中查看您的代码,这就是我的建议:
// Use this function to add the active class and tie the droppable interaction to
function makeDroppable(element) {
element.addClass('active');
element.droppable({
drop: function (event, ui) {
var pieceValue = ui.helper.data('value');
var toBoard = $(this).data('square');
var splitResult = toBoard.split(',')
board[splitResult[0]][splitResult[1]] = pieceValue;
$(this).append(ui.draggable);
}
});
}
然后我会导致 div 被传递给上面的函数,如下所示:
$('.draggable').each(function (index, div) {
$(div).draggable({
snap: '#board',
revertDuration: 500,
cursor: 'move',
opacity: 0.50,
helper: 'clone',
containment: '#board',
revert: function (event, ui) {
$(this).data("value").originalPosition = {
top: 0,
left: 0
};
return !event;
},
start: function () {
var from = $(this).parent().attr('data-square');
var splitSquare = from.split(',');
splitSquare[0] = splitSquare[0];
splitSquare[1] = splitSquare[1] - 2 + 2;
var joinSquare = splitSquare.join();
var div1 = $("div[data-square='" + joinSquare + "']");
makeDroppable(div1); //<- pass in the element to the function
splitSquare[0] = splitSquare[0];
splitSquare[1] = splitSquare[1] - 2 + 3;
var joinSquare = splitSquare.join();
var div2 = $("div[data-square='" + joinSquare + "']");
makeDroppable(div2); //<- pass in the element to the function
splitSquare[0] = splitSquare[0];
splitSquare[1] = splitSquare[1] - 2;
var joinSquare = splitSquare.join();
var div3 = $("div[data-square='" + joinSquare + "']");
makeDroppable(div3); //<- pass in the element to the function
splitSquare[0] = splitSquare[0] - 2 + 3;
splitSquare[1] = splitSquare[1] - 2 + 3;
var joinSquare = splitSquare.join();
var div4 = $("div[data-square='" + joinSquare + "']");
makeDroppable(div4); //<- pass in the element to the function
splitSquare[0] = splitSquare[0] - 2;
splitSquare[1] = splitSquare[1];
var joinSquare = splitSquare.join();
var div5 = $("div[data-square='" + joinSquare + "']");
makeDroppable(div5); //<- pass in the element to the function
}
});
});
http://jsfiddle.net/4KLHs/1/