Question

我修改了一个示例照片管理器应用程序。

而不是照片，我有来自查询的员工记录。我的版本将让管理人员将员工标记为休假或工作时。我所做的一件事就是包括<a href="123">等员工ID。我从event.target获取了id。这适用于单击功能，但不适用于“可放置”功能。这就是我对点击功能的要求：

$('ul.gallery > li').click(function(ev) {
  var $item = $(this);
var $unid = ev.target;
var $target = $(ev.target);
if ($target.is('a.ui-icon-suitcase')) {
 deleteImage($item,$unid);
} else if ($target.is('a.ui-icon-arrowreturnthick-1-w')) {
 recycleImage($item,$unid);
}
return false;

}）;

ev.target正确地给出了员工ID。

当我在其中一个可放置的函数中尝试相同时：

$gallery.droppable({
accept: '#suitcase li',
activeClass: 'custom-state-active',
drop: function(ev, ui) {
 var $unid = ev.target;
 alert($unid);
 recycleImage(ui.draggable,$unid);
}

}）;

警报（ui）给了我[对象]。这个对象是什么？我如何从中获得href？

感谢

Answer 1

在jQuery UI droppable文档中，它向您显示它提供了额外的jQuery对象：

* ui.draggable - current draggable element, a jQuery object.
* ui.helper - current draggable helper, a jQuery object
* ui.position - current position of the draggable helper { top: , left: }
* ui.offset - current absolute position of the draggable helper { top: , left: }

因此，如下更改代码应该有效：

$gallery.droppable({
 accept: '#suitcase li',
 activeClass: 'custom-state-active',
 drop: function(ev, ui) {
  var $unid = ui.draggable.attr('id');
  alert($unid);
  recycleImage(ui.draggable, $unid);
 }
});

Answer 2

我认为这解决了我的问题：

   drop: function(ev, ui) {
    var $unid = $(ui.draggable).attr('id');
    recycleImage(ui.draggable,$unid);
    }

如果我使用它：

 var $unid = ui.draggable.find('id');

然后我得到[对象对象]

另外，我不得不修改：

        $('ul.gallery > li').click(function(ev) {
            var $item = $(this);
            var $unid = $(this).attr('id');
            var $target = $(ev.target);
            if ($target.is('a.ui-icon-suitcase')) {
                deleteImage($item,$unid);
            } else if ($target.is('a.ui-icon-arrowreturnthick-1-w')) {
                recycleImage($item,$unid);
            }
            return false;
        });

就像一个魅力：）

关于jQuery droppable / draggable的问题

2 个答案: