您的.draggable()似乎做错了什么。你还需要
e.preventDefault()
和
e.stopPropagation()
以确保发生跌落。
此代码可正确获取所有事件:
$(function () {
/*
$(".scheduledArticleRow").draggable({
cursor: "move",
cursorAt: {
top: -12,
left: -20
},
opacity: 0.5,
helper: function (event) {
return $("<div class='ui-widget-header'>" + $(this).data('title') + "</div>")
}
});
*/
$(".articleNeededRow").droppable(); // With this commented out the code still works
$(".reservedDateRow").droppable(); // This one too
$(".scheduledArticleRow").on("dragstart", function (e) {
console.log("dragstart");
console.dir(e);
e.originalEvent.dataTransfer.setData("articleId", $(this).data("articleId"))
e.originalEvent.dataTransfer.setData("oldDate", $(this).data("date"));
});
$(".articleNeededRow").on('dragover', function (e) {
console.log("dragover");
e.preventDefault();
e.stopPropagation();
});
$(".articleNeededRow").on('drop', function (e) {
console.log("drop");
e.preventDefault();
e.stopPropagation();
changeScheduledDate(e);
});
$(".reservedDateRow").on('dragover', function (e) {
console.log("dragover");
e.preventDefault();
e.stopPropagation();
});
$(".reservedDateRow").on('drop', function (e) {
console.log("drop");
e.preventDefault();
e.stopPropagation();
changeScheduledDate(e);
});
});
function changeScheduledDate(e) {
articleId = e.originalEvent.dataTransfer.getData("articleId");
oldDate = e.originalEvent.dataTransfer.getData("oldDate");
console.log("articleID: "+articleId);
console.log("oldDate: "+oldDate);
var newDate = $(this).parents(".tr").data("date");
console.log("newDate: "+newDate);
// Do date-change stuff
}
