Question

找到解决方案！ 我发现它，我忽略了我可以得到变量项的id。所以我放var item_id = item.attr('id');这就是我的解决方案。比我想象的要简单得多。谢谢大家的帮助！

好的，所以我在jQuery中有多个可拖动的元素，它们都是图像，但每个都有自己的ID。无论如何，我已经设置了一个功能，一旦图像被放到droppable上就会执行。我希望能够提取图像的ID，以便我可以处理已在我的数据库中删除的图像。

function foundationsInSpot(drag_item,spot)
{
var oldSpotItem = $(spot).find('img');
if(oldSpotItem.length>0) {
    oldSpotItem.appendTo('#foundationinv').draggable({ revert: 'invalid' });
}
var item = $('<img />');
var item_id = "";
var bid = "<?= $bid ?>";
item.attr('src',drag_item.attr('src')).attr('id',drag_item.attr('id')).attr('class',drag_item.attr('class')).appendTo(spot).draggable({ revert: 'invalid' });
drag_item.remove();
alert('BenID: ' + bid + ' Foundation: ' + item_id);
var dataString = 'item_id='+ item_id + '&bid=' + bid;  
    $.ajax({
        type: "POST",
        data: dataString,
        url: "http://motb.isgreat.org/objects/pfoundations.php",
    });
}

这就是我的代码。我需要找item_id。这是我的猜测var item_id = $('<img />').attr('id');，但它返回了空白信息。我也尝试了var item_id = ui.draggable.attr("id");，这只是停止了我的其余功能。有任何想法吗？提前谢谢。

顺便说一句，这是我的可拖动物品的样子。 <img src='http://motb.isgreat.org/objects/khhhqw4s.png' class='object foundation' id='khhhqw4s'/>

更新我将var item_id = ui.draggable.attr("id");移到了if语句之上，现在我得到了undefined。所以我不确定从哪里开始，但我知道我的AJAX调用正在运行，因为它使用undefined更新我的数据库。

更新 - 再次

所以这就是我如何调用我的函数，如果这样做更容易。

    $(".foundations").draggable({ revert: 'invalid'}).addTouch;
$('#foundationinv').droppable({accept: '.foundations'});
$("#foundations").droppable({ accept: '.foundations'})
$('#foundations,#foundationinv').bind('drop', function(ev,ui) { foundationsInSpot(ui.draggable,this); });

我之前从未做过这样的事情，所以它真的超越了我。如果您想亲自查看该页面，请转到http://motb.isgreat.org/并单击登录按钮，然后使用 testbot 获取用户名和密码。要查看可拖动装置的位置，在左侧有一个大盒子，下方有4个较小的盒子，单击小盒子上面的单词是基础。我试图拖动出现在小方框中的那些对象。您可以通过我尝试传递的信息查看警报。如果有任何问题，请随时查看我的来源，这些项目是从我的数据库中调出的，所以我的PHP可能会从你的来源中遗漏。

我发现它，我忽略了我可以获得变量项的id。所以我把var item_id = item.attr('id');放在那里，这是我的解决方案。比我想象的要简单得多。谢谢大家的帮助！

Answer 1

在droppable内你有一个名为drop

的属性

$("#destination").droppable({
   hoverClass: 'ui-state-hover',        
   helper: 'clone',        
   cursor: 'move',        
   drop: function(event, ui) {            
       $(this).addClass('ui-state-highlight');
       $(ui.draggable).addClass('ui-state-highlight');     
       $(ui.draggable).draggable('disable');

       console.log('Dragged: ' + $(ui.draggable).attr("id"));
   }    
});

使用该方法调用调用$(ui.draggable).attr("id")

的对象

如果你看到对象，ui.draggable只是HTML，很快就用$()包裹它，你就可以用它做任何jQuery操作。

http://jsbin.com/iboli4/edit

在Inspector中打开控制台以查看ID

jQuery draggable - 得到draggable的id

1 个答案: